javascript - 如何禁用 HTML 中基于单选按钮的文本字段？

Question

我有以下文本字段，我想在单击单选按钮时启用它，否则应该禁用它:

function Chosen4() if (document.getElementById('rbothers4').checked == true) {
      message += " (Others)"
     document.getElementById("cbotherstext4").setAttribute("disabled", true);
}

HTML 代码在这里

<input type="radio" name="Promised" id="rbothers4" onclick="displayResult(this.value)"   value="Yes6" >c. Others
       (Please Specify)
<input id="cbotherstext4" type="text" />&nbsp;</td>
<input type="button" id="Button4" onclick="Chosen4()" value="Date Promised"/>

Answer 1

1. 您的示例中没有复选框。
2. 不要使用内联事件处理
3. 如果您选择这样做，请将对象传递给函数

JavaScript解决方案

Live Demo

window.onload=function() {
  var promised = document.getElementsByName("Promised4");
  for (var i=0;i<promised.length;i++) {
    promised[i].onclick=function() {
      var rads = this.form[this.name];
      for (var i=0;i<rads.length;i++) {
        var textField = this.form[rads[i].value.toLowerCase()+"Specify"];
        if (textField) textField.disabled = !rads[i].checked;
      }    
    }    
  }
}       

jQuery 解决方案

Live Demo

$(function() {
  var $promised = $("input[name='Promised4']");
  $promised.each(function() {
    $(this).on("click",function() {
      $promised.each(function() {
        var textField = $(this).nextAll("input").first();
        if (textField) textField.prop("disabled",!this.checked);
      });    
    });    
  });
});       

使用

<form>
  <input type="radio" name="Promised4" id="rbYes" value="Yes" ><label for="rbYes">a. Yes</label><br/>
  <input type="radio" name="Promised4" id="rbNo"  value="No" ><label for="rbNo">b. No (please specify)</label>
  <input type="text" name="noSpecify"  id="noSpecify" value="" disabled="disabled" /><br/>
  <input type="radio" name="Promised4" id="rbOther" value="Other" ><label for="rbOther">c. Other (please specify)</label>
  <input type="text" name="otherSpecify" id="otherSpecify" value="" disabled="disabled"/><br/>
</form>