JavaScript 链接下拉菜单到复选框



我正在尝试将我的HTML下拉菜单链接到我的表格,其中有复选框。

此 javascript 函数尝试查看是否已选择"弧"值,然后禁用显示光谱的复选框 3:

function showShields()
{
if (document.getElementById("Shield").value == ("arc")
{
document.getElementById("checkBox3").disabled=true;
}
}

这是 HTML 代码:

<!DOCTYPE html>
<html>
<head>
<script src="SpiritShield.js"></script>
</head>
<body>
<p>What kind of shield are you interested in?</p>
<select id="Shield">
   <option value="arc">ARC</option>
   <option value="divine">GAS</option>
   <option value="spectral">MIG</option>
   <option value="elysian">ANY</option>
</select>
</body>
<table border="2" cellspacing="0">
<tr>
   <th>Checkbox</th>
   <th>Shield</th>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox1"</td>
   <td>ARC1</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox2"</td>
   <td>ARC2</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox3"</td>
   <td>SPECTRAL1</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox4"</td>
<td>SPECTRAL2</td>
</tr>
</table>
</html>

有人可以帮我解决这个问题吗?

谢谢

你的代码很好,尽管我确实注意到 if 条件中缺少括号:

function showShields()
{
if (document.getElementById("Shield").value == ("arc")) //your missing missing parenthesis was here
{
document.getElementById("checkBox3").disabled=true;
}
}

试试这个: http://jsfiddle.net/Hpcsq/2/

function showShields(what)
    {
    if (what.value == ("arc"))
        {
        document.getElementById("checkBox3").checked=false;
        }
    }​
<!DOCTYPE html>
<!DOCTYPE html>
<html>
<head>
<script src="SpiritShield.js"></script>
</head>
<body>
<p>What kind of shield are you interested in?</p>
<select id="Shield" onchange="showShields(this)">
       <option value="arc">---</option>
   <option value="arc">ARC</option>
   <option value="divine">GAS</option>
   <option value="spectral">MIG</option>
   <option value="elysian">ANY</option>
</select>
</body>
<table border="2" cellspacing="0">
<tr>
   <th>Checkbox</th>
   <th>Shield</th>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox1"</td>
   <td>ARC1</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox2"</td>
   <td>ARC2</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox3" checked="checked"></td>
   <td>SPECTRAL1</td>
</tr>
<tr>
   <td><input type="checkbox" id="checkBox4"</td>
<td>SPECTRAL2</td>
</tr>
</table>
</html>​

最新更新