2011-03-10 110 views
0

我已经完成了类似的操作。如何使复选框在多种情况下启用和禁用文本框

<html> 
<head> 
<script type="text/javascript"> 
<!-- 
function toggleTB(what){ 
if(what.checked){document.theForm.theTB.disabled=1} 
else{document.theForm.theTB.disabled=0}} 
//--> 
</script> 
</head> 
<body> 
<form name="theForm"> 
<input type="checkbox" name="theCB" onClick="toggleTB(this)">Toggle The Text Box<br> 
<input type="text" name="theTB" value="asdf"> 
</form> 
</body> 
</html> 

但这仅用于一个再寄一次重复需要这个功能在其他行也让我怎么能使用此功能多次。

我的形式是这样的:

<tr>  
<td style="border-top:none; text-decoration:underline;" >Specific operations/procedures</td> 
<td> 
<input type="checkbox" name="sd3[]" value="mfi_nam9" />Other(please specify): 
<input type="text" name="mfi_nam9" class="text required" id="mfi_name" 
</td> 
</tr> 
<tr>  
<td style="border-top:none; text-decoration:underline;" >General principles/strategies</td> 
<td> 
<input type="checkbox" name="sd2[]" value="mfi_nam8" />Other(please specify): 
<input type="text" name="mfi_nam8" class="text required" id="mfi_name" 
</td> 
</tr> 

我将等待乌拉圭回合的反应,我非常感谢u人帮助我以前并希望你能帮助我这个时间太长。

回答

1

阅读本article

我宁愿jQuery的

这里是DEMO

Another DEMO

+0

我喜欢这个,但是当我使用jquery-1.5时,我的设计受到影响。那么该怎么做,除了jQuery之外,还有其他解决方案吗? – Nyaro 2011-03-10 09:13:39

0

我们可以把代码和不喜欢
1的Javascript修改的修改:
function toggleTB(what,elid) { if(what.checked) { document.getElementById(elid).disabled=1 } else { document.getElementById(elid).disabled=0 } }
2.复选框HTML代码的修改,我们已经使用了的ID被改变为
<input type="checkbox" name="sd3[]" value="mfi_nam9" onClick="toggleTB(this,'mfi_name1')" />Other(please specify): <input type="text" name="mfi_nam9" class="text required" id="mfi_name1" />
注即使您从php代码生成这些文本框,也可以生成每个文本框。

0

的onclick添加到每个复选框

<input type="checkbox" name="sd2[]" value="mfi_nam8" onClick="toggleTB(this)" />Other(please specify): 

,并宣布toggleTB作为

function toggleTB(what){ 
    what.form.elements[what.value].disabled = what.checked; 
} 
0

Java脚本修饰:

function toggleTB(what){ 

var theTB = document.getElementById(what.value); 

if(what.checked){theTB.disabled=1} 
else{theTB.disabled=0} 

}

HTML修饰:

<table> 
    <tr>  
    <td style="border-top:none; text-decoration:underline;" >Specific operations/procedures</td> 
    <td> 
    <input type="checkbox" name="sd3[]" onClick="toggleTB(this)" value="mfi_nam9" />Other(please specify): 
    <input type="text" name="mfi_nam9" id="mfi_nam9" class="text required" /> 
    </td> 
    </tr> 
    <tr>  
    <td style="border-top:none; text-decoration:underline;" >General principles/strategies</td> 
    <td> 
    <input type="checkbox" name="sd2[]" onClick="toggleTB(this)" value="mfi_nam8" />Other(please specify): 
    <input type="text" name="mfi_nam8" id="mfi_nam8" class="text required" /> 
    </td> 
    </tr> 

</table> 

说明:这里我用ID而不是NAME来验证表格输入框元素。

我觉得这没有什么意义,以禁用检查事件相关复选框文本框中。您可能想要启用文本框只要有人选中复选框指定其他的东西,我不知道你想要做什么。

如果你想去做什么,我猜,只是改变了JAVA SCRIPT线为波纹管 -

if(what.checked){theTB.disabled=0} // have placed 0 in place of 1 
    else{theTB.disabled=1} // have placed 1 in place of 0 
} 

HTML INPUT-BOX为波纹管 -

,或者如果你认为要切换(启用/禁用)复选框,这是不可能的,因为你知道禁用一个元素后点击事件不会对第e元素,所以它将如何禁用:)

相关问题