CODEWITHSUNDEEP
javascriptcsshtml
Kevin
Kevin

Reputation: 11

Javascript displaying a div

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

Upvotes: 0

Views: 169

Answers (5)

Romani
Romani

Reputation: 3241

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>

Upvotes: -1

Quentin
Quentin

Reputation: 943568

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).

Upvotes: 2

Christian Mann
Christian Mann

Reputation: 8125

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.

Upvotes: 0

kbvishnu
kbvishnu

Reputation: 15630

Please try this

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

Upvotes: -1

Sarfraz
Sarfraz

Reputation: 382696

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.

Upvotes: 1

Related Questions