hide radio button onclick javascript
i am trying to hide radio button values when you click it. i can do this if in a non dynamic way like this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript">
<!--
function showDiv( id ) {
document.all.textBox01.style.visibility = 'hidden';
document.all.textBox02.style.visibility = 'hidden';
document.all.textB开发者_运维技巧ox01.value = '';
document.all.textBox02.value = '';
document.all[ id ].style.visibility = 'visible';
document.all[ id ].focus();
}
-->
</script>
</head>
<body>
Option 1:
<input type=radio name=radioBtn onClick="showDiv( 'textBox01' );">
<div id=textBox01 style="visibility:hidden">test2</div>
Option 2:
<input type=radio name=radioBtn onClick="showDiv( 'textBox02' );">
<div id=textBox02 style="visibility:hidden">test</div>
</body>
</html>
i want to do it in a dynamic way, but my brain stalled, any tips is greatly appreciated:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript">
<!--
function change(rad)
{
for(var i = 1; i <= 5; ++i)
{
if(i <= rad.value)
{ document.getElementById("radio" + i).style.visibility = "hidden";
}else
{ document.getElementById("radio" + i).style.value = "";
}
}
}
-->
</script>
</head>
<body>
Option 1:
<input type=radio name=radioBtn onClick="change(this)">
<div id=radio1 style="visibility:hidden">test2</div>
Option 2:
<input type=radio name=radioBtn onClick="change(this)">
<div id=radio2 style="visibility:hidden">test</div>
</body>
</html>
Use
function change(rad)
{
var elem;
for(var i = 1; i <= 5; ++i)
{
elem = document.getElementById("radio" + i);
if(i != parseInt(rad.value))
{ if(elem != null) elem.style.visibility = "hidden";
}else
{ if(elem != null) elem.style.visibility = "visible";
}
}
}
but do not forget to give numeric values to the radio buttons
i think you didn't mean:
if (i <= rad.value)
where is rad.value supplied?
精彩评论