复选框使用JavaScript功能禁用/启用查询

Question

我对JavaScript相当陌生，为此我整天都在搜寻Google，但是我只发现了如何使用一个复选框启用和禁用一个文本框。 我对代码进行了一些调整，以实现所需的功能，这就是我所得到的。 我正在考虑指示JS函数仅遵循复选框的ID，但似乎无法弄清楚该怎么做。

这是我的代码：

的JavaScript

 <script>
 function enableText(checked){
     if(!checked){
         document.getElementById('sel1').disabled = true;
         document.getElementById('txt1').disabled = false;
     }
     else{
         document.getElementById('sel1').disabled = false;
         document.getElementById('txt1').disabled = true;
     }
 }
 function enableText(checked){
     if(!checked){
         document.getElementById('sel2').disabled = true;
         document.getElementById('txt2').disabled = false;
     }
     else{
         document.getElementById('sel2').disabled = false;
         document.getElementById('txt2').disabled = true;
     }
 }
 </script>

的HTML

 <form name=sr2 method=post>
      <select name="pt" id="sel1">
           <option>test</option>
      </select>

      <input type="checkbox" name="cb1" checked="checked" onclick="enableText(this.checked)">
      Others

      <input type="text" name="pt" id="txt1" disabled="disabled">

      <select name="dept" id="sel2">
           <option>test</option>
      </select>

      <input type="checkbox" name="cb2" onclick="enableText(this.checked)"  checked="checked">
      Others

      <input type="text" name="dept" id="txt2" disabled="disabled">
 </form>

我的问题是如何在js中设置功能以指示cb1仅启用txt1并禁用sel1和cb2仅启用txt2并禁用sel2 ？ 我的代码有效，但是由于某种原因，它同时启用txt1和txt2并同时禁用sel1和sel2 。

任何帮助是极大的赞赏。

Answer 1

您已经创建了两个具有相同名称的函数： enableText 。 简化代码：

function enableText(checked, index){
     var sel = true, txt = false;

     if(checked) {
         sel = false;
         txt = true;
     }

     document.getElementById('sel' + index).disabled = sel;
     document.getElementById('txt' + index).disabled = txt;
}

在您的HTML中：

onclick="enableText(this.checked, 1)"

并更改下一个项目的第二个参数。

具有三元数的函数的第二个版本，但具有相同的目的：

function enableText(checked, index) {
     document.getElementById('sel' + index).disabled = (checked ? false : true);
     document.getElementById('txt' + index).disabled = (checked ? true : false);
}