jquery启用/禁用基于radiobutton的文本框

时间:2009-10-07 13:46:58

标签: jquery checkbox radio-button

在我的页面(jsp)中,我有一个radiobutton组和一个文本框(最初被禁用)。

  • 每当用户点击单选按钮时,应启用文本框
  • 当用户点击其他一些单选按钮时,文本框应再次被禁用。

我可以使用以下代码启用最初禁用的复选框。

$("#DevGroup_OTHER").click(function(){          
    $("#otherDevText").attr("disabled","");
})

我的问题:

  • 但我怎样才能再次禁用文本框?
  • 使用jQuery是否有更简单的解决方案?

问候

2 个答案:

答案 0 :(得分:33)

始终禁用它(对于每个单选按钮),如果单选按钮是启用文本框的单选按钮,则重新启用它。除非用户使用1980年制造的机器,否则它将如此之快,而不是人们所知道的。

$('radio').click(function() { 
    $("#otherDevText").prop("disabled",true);
    if($(this).attr('id') == 'enable_textbox') {
        $("#otherDevText").prop("disabled",false);
    }
});

或者,如果有多个单选按钮可以启用文本框:

$('input:radio').click(function() { 
  $("#otherDevText").prop("disabled",true);
  if($(this).hasClass('enable_tb')) {
      $("#otherDevText").prop("disabled",false);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<fieldset id="DevGroup_OTHER">
  <input type="radio" id="d1" name="r1" value="d1">dev1 <br /> 
  <input type="radio" id="d2" name="r1" value="d2">dev2 <br/> 
  <input type="radio" id="d3" name="r1" value="d3" class="enable_tb"> enable
</fieldset>
<br />
<input id="otherDevText" name="tb1" disabled="disabled"
       value="some Textbox value" type="text">

有意义吗?

答案 1 :(得分:7)

$("#some_other_radiobutton").click(function(){
  $("#otherDevText").attr("disabled","disabled");
});