0

I am hoping you guys can help me with this. I have the following code

 </textarea> <br />Word Count: <input type="text" name="c" value="311" size="5" onkeyup="cnt(document.script.w,this)" /> </form> <script type="text/javascript"> var myNumValue = document.getElementById('c').value; var myNum = parseInt(myNumValue); var upperLimit=200; var lowerLimit=10; if(upperLimit == lowerLimit) { document.getElementById('div1').style.visibility='visible'; } </script> <div id="div1" style="visibility: hidden;"> Super cool hidden div! </div> 

For some reason, I cannot get the div to show. I have tried setting the upper and lower the same and using == in if, anything inside of the if displays (for example if a do a document.write it will show up) but for some reason the div will not show.

What am I missing?

Thanks!

Kevin

3
  • 2
    Is it possible that the 'div1' object hasn't been created at the time this javascript is being run? You may want to put the 'div1' declaration before the the javascript. Commented Nov 1, 2010 at 5:22
  • 1
    To add to the above. Do an alert on document.getElementById('div1') to ensure it is returning an object. Commented Nov 1, 2010 at 5:24
  • 1
    To add further to the above: It's generally considered good practice to put your scripts just before your </body> tag, to avoid this kind of thing. Commented Nov 1, 2010 at 5:25

5 Answers 5

2

Your first problem is that the input has no id so, as Sarfraz says, document.getElementById('c') will error.

That is not the only critical problem though.

Your script is not in a function, so it will run as soon as it is parsed.

The div element appears in the document after the script element, so the browser doesn't know it exists at the time the script runs.

document.getElementById('div1') will therefore error.

Either move the script element to after the div element, or wrap it in a function and delay execution until an event that will fire after the element exists (such as onload (standard) or ondomready (provided by many JS libraries).

Sign up to request clarification or add additional context in comments.

Comments

1

You have not specified id attribute for your field:

<input type="text" name="c" value="311" size="5" onkeyup="cnt(document.script.w,this)" /> 

Should be:

<input type="text" name="c" id="c" value="311" size="5" onkeyup="cnt(document.script.w,this)" /> 

Because you are missing the id there, you are most likely getting an error and your script halts in the middle; a reason why your code does not reach that if condition.

Comments

0

Did you forget to close your <script> tag or did you just not cut/paste it?

The line

if(upperLimit == lowerLimit) 

is never true; you just defined upperLimit to be not equal to lowerLimit.

2 Comments

Quoting from OP: I have tried setting the upper and lower the same and using ==
I'll be darned, it was there. Huh.
-1

Please try this

document.getElementById('div1').style.display = 'block'; 

1 Comment

OP is using ` style="visibility: hidden;"`
-1

u have not created object of div1 first create object.

<div id="div1" style="visibility: hidden;"> Super cool hidden div! </div> <script type="text/javascript"> var myNumValue = document.getElementById('c').value; var myNum = parseInt(myNumValue); var upperLimit=200; var lowerLimit=200; if(upperLimit == lowerLimit) { document.getElementById('div1').style.visibility='visible'; } </script> 

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.