Javascript hide/show classes with checkbox
Posted
by Christina
on Stack Overflow
See other posts from Stack Overflow
or by Christina
Published on 2010-03-29T08:50:32Z
Indexed on
2010/03/29
8:53 UTC
Read the original article
Hit count: 344
JavaScript
I am just learning javascript, so please bear with me!
I want to be able to use checkboxes to choose to hide/show div classes (to basically filter the amount of info being shown). It is done in this... but I'm try to figure out something much simpler (since I don't need to dynamically generate the checkbox options.)
I came across this example: The Javascript:
function showMe (it, box) {
var vis = (box.checked) ? "block" : "none";
document.getElementById(it).style.display = vis;
}
The HTML
<form>
<input type="checkbox" checked="checked" value="value1" onclick="showMe('div1', this)" />value1
<input type="checkbox" checked="checked" value="value2" onclick="showMe('div2', this)" />value2
<input type="checkbox" checked="checked" value="value3" onclick="showMe('div3', this)" />value3
</form>
<div id="div1" style="display:block">Show Div 1</div>
<div id="div2" style="display:block">Show Div 2</div>
<div id="div3" style="display:block">Show Div 3</div>
</body>
</html>
But it only works for div ids, not classes. Any idea on how I can work this?
Thanks in advance if you can help me out!
© Stack Overflow or respective owner