javascript单选按钮 [英] javascript radio button
本文介绍了javascript单选按钮的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试进行一些项目，希望在其中选择专家按钮时显示一个文本框，而在单击学习者按钮时不显示任何文本框....
I am trying to make some project in which i want a text box to be displayed when I select expert button and no text box when i click on learner button....
我已经编写了这段代码，但无法解决问题...请帮忙...
I have written this code but not able to get the problem... Plz some help...
<html>
<head>
<script language="javascript">
function toggleContent(showHideDiv, switchTextDiv) {
var text = document.getElementById(showHideDiv);
var ele = document.getElementById(switchTextDiv);
var rad_val='';
for (var i=0; i < document.text.role.length; i++)
{
if (document.text.role[i].checked)
{
rad_val = document.text.role[i].value;
}
}
if(rad_val=='learner'){
ele.style.display = "block";
}
else {
ele.style.display = "none";
}
}
</script>
</head>
<body>
<table>
<tr >
<td ><option value="1"> 1 </option>
</td>
<td> Role </td>
<form id="form1">
<td><label>
<input type="radio" name="role" value='learner' onClick="toggleContent('form1','div1')" >
Learner </label>
</td>
<td><label>
<input type="radio" name="role" value='expert' onClick="toggleContent('form1','div1')" >
Expert </label>
</form>
<td ><div ID="div1" align=right style="display:none;">
<label class="labell labelUser" >why?</label>
<textarea name="description" align="right" id="description" cols="40" rows="5" class="inputbox">Why?</textarea>
<span id="descriptionError" class="notifyForUser" spanError></span> </div></td>
</tr>
<tr >
<td ><option value="2"> 2 </option>
</td>
<td> Role </td>
<form id="form2">
<td><label>
<input type="radio" name="role" value='learner' onClick=toggleContent('form2','div2') >
Learner </label>
</td>
<td><label>
<input type="radio" name="role" value='expert' onClick=toggleContent('form2','div2') >
Expert </label>
</td>
</form>
<td ><div ID="div2" align=right style="display:none;">
<label class="labell labelUser" >why?</label>
<textarea name="description" align="right" id="description" cols="40" rows="5" class="inputbox">Why?</textarea>
<span id="descriptionError" class="notifyForUser" spanError></span> </div></td>
</tr>
</table>
</body>
</html>
推荐答案
这是解决方案.感谢@ dragon66解决我的问题.
This is the solution. Thanks @dragon66 to solve my issue.
function toggleContent(showHideDiv, switchTextDiv) {
var text = document.getElementById(showHideDiv);
var ele = document.getElementById(switchTextDiv);
var rad_val='';
for (var i=0; i < text.role.length; i++)
{
if (text.role[i].checked)
{
rad_val = text.role[i].value;
}
}
if(rad_val=='learner'){
ele.style.display = "block";
}
else {
ele.style.display = "none";
}
}
</script>
</head>
<body>
<table>
<tr >
<td ><option value="1"> 1 </option>
</td>
<td> Role </td>
<form id="form1">
<td><label>
<input type="radio" name="role" value='learner' onClick="toggleContent('form1','div1')" >
Learner </label>
</td>
<td><label>
<input type="radio" name="role" value='expert' onClick="toggleContent('form1','div1')" >
Expert </label>
</form>
<td ><div ID="div1" align=right style="display:none;">
<label class="labell labelUser" >why?</label>
<textarea name="description" align="right" id="description" cols="40" rows="5" class="inputbox">Why?</textarea>
<span id="descriptionError" class="notifyForUser" spanError></span> </div></td>
</tr>
<tr >
<td ><option value="2"> 2 </option>
</td>
<td> Role </td>
<form id="form2">
<td><label>
<input type="radio" name="role" value='learner' onClick=toggleContent('form2','div2') >
Learner </label>
</td>
<td><label>
<input type="radio" name="role" value='expert' onClick=toggleContent('form2','div2') >
Expert </label>
</td>
</form>
<td ><div ID="div2" align=right style="display:none;">
<label class="labell labelUser" >why?</label>
<textarea name="description" align="right" id="description" cols="40" rows="5" class="inputbox">Why?</textarea>
<span id="descriptionError" class="notifyForUser" spanError></span> </div></td>
</tr>
</table>
</body>
</html>
这篇关于javascript单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
