Tom's Guide | Tom's Hardware | Tom's Games
 |
 |
 |
Hi everyone. I need help.
Here's example of html & css;
[style]
.item_id {
visibility:hidden;
}
[/style][html]
...
[div id="ITEM_ID-A001" class="item_id"]...[/div]
[div id="ITEM_ID-A002" class="item_id"]...[/div]
...
[div id="ITEM_ID-A009" class="item_id"]...[/div]
...
[/html]The problem is, if i wrote JS exactly like this:
document.getElementById("ITEM_ID-A001").style.visibility = "visible";
document.getElementById("ITEM_ID-A002").style.visibility = "visible";
...
document.getElementById("ITEM_ID-A009").style.visibility = "visible";
ALL [div] will become visible.However, when i try to loop like this:
i = 0
while (i <= 9)
{
document.getElementById("ITEM_ID-A00" + i).style.visibility = "visible";
i++
}
ALL [div] still remain hidden.If i have 999 items, it would take 999 lines to make it visible if i don't loop.
I need help on this. Thanks in advance.
Well, that works for me just fine. Are you sure you don't have a typo or other problem with the code? By the way, I would suggest creating another class for the "visible" elements and changing the class of the divs. Just a thought.
Anyway, here is the test code I tried that worked:
<html>
<head>
<style>
.item_id {
visibility:hidden;
}
</style><script>
function runCode() {
document.getElementById("ITEM_ID-A001").style.visibility = "visible";
var i = 2;
while (i<=4) {
document.getElementById("ITEM_ID-A00"+i).style.visibility = "visible";
i++;
}
}</script>
</head>
<body>
<div id="ITEM_ID-A001" class="item_id">1</div>
<div id="ITEM_ID-A002" class="item_id">2</div>
<div id="ITEM_ID-A003" class="item_id">3</div>
<div id="ITEM_ID-A004" class="item_id">4</div><button onclick="runCode()">Click</button>
</body>
</html>Michael J
0 
thanks MichaelJ. after studying your example, it works when I declare var i = 1. that's strange, i wonder why it didn't work when i declare var i = 0.
0
Well, that would because the first time through the loop it would be trying to reference the object with the ID 'A000'. And since that object does not exist you get the error. If you would have looked at the error message it should have told you that(double click the error icon in the bottom left of the browser window).
Michael J
0  |
 My Website.... what do yo...
|
Password protect website ...
|
This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |
