我试图控制下拉菜单的功能，规则是
两个框不能同时打勾
如果仅选择一个框，则下拉列表应可编辑，否则应为只读
当没有勾选时，下拉列表应变为只读
选中一个框后，下拉列表应变为可编辑状态（与选中哪个框无关）
问题是，当我勾选一个框时，它变为可编辑状态，但是当我选择第二个框时，它变为禁用状态，
只要取消选中某个框（只要两个框都必须被取消选中），就应始终可编辑向下选项
那么应该禁用下拉菜单
<html>
<head>
<script type="text/javascript">
function myFunction() {
if (document.getElementById("1").disabled == false) {
document.getElementById("10").disabled = true;
//set default
document.getElementById("10").value = "OptionOne"
//first drop down
document.getElementById("1").disabled = true;
//set default
document.getElementById("1").value = "ReasonOne"
} else {
document.getElementById("1").disabled = false;
}
}
</script>
<script type="text/javascript">
var previousCheckId;
function toggle(chkBox) {
if (chkBox.checked) {
if (previousCheckId) {
document.getElementById(previousCheckId).checked = false;
}
previousCheckId = chkBox.getAttribute('id');
}
}
</script>
</head>
<body>
<input type="checkbox" id="chkBox100" onClick="myFunction();toggle(this);"/>
<input type="checkbox" id="chkBox121" onClick="myFunction();toggle(this);"/>
<select disabled id="1" >
<option value="OptionOne">First Option</option>
<option value="OptionTwo">Second Option</option>
</select>
<select disabled id="10" >
<option value="ReasonOne">First Option</option>
<option value="ReasonTwo">SecondOption</option>
</select>
</body>
</html>
最佳答案
您是说类似的意思还是要分别包装每个盒子？
您的问题描述得不好。但作为额外的信息：如果要读取复选框的值，则应获取复选框的值，而不是监视选项菜单的状态！
<html>
<head>
<script type="text/javascript">
function myFunction() {
if (document.getElementById("chkBox100").checked) {
//first drop down
document.getElementById("1").disabled = false;
//set default
document.getElementById("1").value = "ReasonOne"
} else {
document.getElementById("1").disabled = true;
}
if (document.getElementById("chkBox121").checked) {
//second drop down
document.getElementById("10").disabled = false;
//set default
document.getElementById("10").value = "ReasonOne"
} else {
document.getElementById("10").disabled = true;
}
}
</script>
<script type="text/javascript">
function toggle1() {
if (document.getElementById("chkBox100").checked) {
document.getElementById("chkBox121").checked = false;
}
}
function toggle2() {
if (document.getElementById("chkBox121").checked) {
document.getElementById("chkBox100").checked = false;
}
}
</script>
</head>
<body>
<input type="checkbox" id="chkBox100" onClick="toggle1();myFunction();"/>
<input type="checkbox" id="chkBox121" onClick="toggle2();myFunction();"/>
<select disabled id="1" >
<option value="OptionOne">First Option</option>
<option value="OptionTwo">Second Option</option>
</select>
<select disabled id="10" >
<option value="ReasonOne">First Option</option>
<option value="ReasonTwo">SecondOption</option>
</select>
</body>
</html>
关于javascript - JavaScript代码无法正常工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26404583/