javascript javascript禁用/启用复选框和下拉菜单
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6685137/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
javascript to disable/enable checkbox and dropdown menu
提问by tim
Hi I am trying to disable a drop down when a checkbox is checked and the when the checkbox is unchecked enable the drop down. below is my javascript and it is working when I check the checkbox but it won't let me uncheck the checkbox:
嗨,我试图在选中复选框时禁用下拉菜单,而在未选中复选框时启用下拉菜单。下面是我的 javascript,当我选中复选框时它正在工作,但它不会让我取消选中复选框:
<script type="text/javascript">
function test(obj){
if (document.getElementsByName("aForm[0].info")[0].checked = true) {
alert("here");
document.getElementsByName("aForm[0].gender")[0].disabled = true;
}
else document.getElementsByName("aForm[0].info")[0].checked = false;{
document.getElementsByName("aForm[0].gender")[0].enabled = true;
}
}
</script>
and here is my jsp
这是我的jsp
<logic:iterate id="data" name="aForm" property="testList">
<tr>
<td>
<html:checkbox indexed="true" name="aForm" styleId="something" property="info" onclick="test(this)"/>
</td>
<td>
<html:select name="aForm" indexed="true" property="unit" styleId="dropdown">
<html:optionsCollection name="aForm" property="selectGender" value="value" label="label"/>
</html:select>
>
</td>
</tr>
</logic:iterate>
回答by epascarello
You are storing a value, not comparing
您正在存储一个值,而不是比较
The if statement
if 语句
if( document.getElementsByName("aForm[0].info")[0].checked = true )
should be
应该
if( document.getElementsByName("aForm[0].info")[0].checked == true )
notice the ==
注意==
And what is with the else?
还有什么是其他的?
else document.getElementsByName("aForm[0].info")[0].checked = false;{
You are treating it like an else if(), else does not have a statement there.
你把它当作 else if(),else 在那里没有声明。
Your code should throw JavaScript errors when run.
您的代码在运行时应该抛出 JavaScript 错误。
And there is no such thing as enabled, it is just disabled, true/false.
并且没有启用这样的东西,它只是禁用,真/假。
Your code should look like
你的代码应该看起来像
function test(obj) {
if (document.getElementsByName("aForm[0].info")[0].checked = true) {
document.getElementsByName("aForm[0].gender")[0].disabled = true;
}
else {
document.getElementsByName("aForm[0].gender")[0].disabled= false;
}
}
and it can be simplified down to just 3 lines:
它可以简化为 3 行:
function test(obj) {
document.getElementsByName("aForm[0].gender")[0].disabled = document.getElementsByName("aForm[0].info")[0].checked;
}
and to make it work without the element names:
并使其在没有元素名称的情况下工作:
<script>
function test(cb){
cb.parentNode.parentNode.getElementsByTagName("select")[0].disabled = cb.checked;
}
</script>
<table>
<tbody>
<tr>
<td><input type="checkbox" onclick="test(this);"></td>
<td><select><option>a</option><option>b</option></select></td>
</tr>
<tr>
<td><input type="checkbox" onclick="test(this);"></td>
<td><select><option>a</option><option>b</option></select></td>
</tr>
</tbody>
</table>
Note: parentNode.parentNode is bound to break if the page structure changes. :)
注意:如果页面结构发生变化,parentNode.parentNode 必然会中断。:)