使用jquery禁用文本框？

Question

我有相同的名称和不同values.When三个单选按钮我点击第三个单选按钮,复选框和文本框将被disabled.but当我选择其他两个单选按钮,它必须是show.I需要在Jquery.Thanks帮助预先....

<form name="checkuserradio">
    <input type="radio" value="1" name="userradiobtn" id="userradiobtn"/> 
    <input type="radio" value="2" name="userradiobtn" id="userradiobtn"/>
    <input type="radio" value="3" name="userradiobtn" id="userradiobtn"/>
    <input type="checkbox" value="4" name="chkbox" />
    <input type="text" name="usertxtbox" id="usertxtbox" />
</form>

Answer 1

HTML

<span id="radiobutt">
  <input type="radio" name="rad1" value="1" />
  <input type="radio" name="rad1" value="2" />
  <input type="radio" name="rad1" value="3" />
</span>
<div>
  <input type="text" id="textbox1" />
  <input type="checkbox" id="checkbox1" />
</div>

使用Javascript

  $("#radiobutt input[type=radio]").each(function(i){
    $(this).click(function () {
        if(i==2) { //3rd radiobutton
            $("#textbox1").attr("disabled", "disabled"); 
            $("#checkbox1").attr("disabled", "disabled"); 
        }
        else {
            $("#textbox1").removeAttr("disabled"); 
            $("#checkbox1").removeAttr("disabled"); 
        }
      });

  });

Answer 2

不是真的有必要,但对okw代码的一个小改进会使函数调用更快(因为你在函数调用之外移动条件).

$("#radiobutt input[type=radio]").each(function(i) {
    if (i == 2) { //3rd radiobutton
        $(this).click(function () {
            $("#textbox1").attr("disabled", "disabled");
            $("#checkbox1").attr("disabled", "disabled");
        });
    } else {
        $(this).click(function () {
            $("#textbox1").removeAttr("disabled");
            $("#checkbox1").removeAttr("disabled");
        });
    }
});

Answer 3

这个线程有点旧,但应该更新信息.

http://api.jquery.com/attr/

要检索和更改DOM属性(如表单元素的已检查,已选择或已禁用状态),请使用.prop()方法.

$("#radiobutt input[type=radio]").each(function(i){
$(this).click(function () {
    if(i==2) { //3rd radiobutton
        $("#textbox1").prop("disabled", true); 
        $("#checkbox1").prop("disabled", true); 
    }
    else {
        $("#textbox1").prop("disabled", false); 
        $("#checkbox1").prop("disabled", false);
    }
  });
});

Answer 4

我不确定为什么其中一些解决方案使用.each() - 这是没有必要的.

这里有一些工作代码,如果单击第3个复选框则禁用,否则将删除disabled属性.

注意:我在复选框中添加了一个ID.此外,请记住,文档中的ID必须是唯一的,因此要么删除单选按钮上的ID,要么使它们唯一

$("input:radio[name='userradiobtn']").click(function() {
    var isDisabled = $(this).is(":checked") && $(this).val() == "3";
    $("#chkbox").attr("disabled", isDisabled);
    $("#usertxtbox").attr("disabled", isDisabled);
});

Answer 5

我知道回答旧问题并不是一个好习惯,但我会把这个答案给那些后来会看到这个问题的人.

现在改变JQuery状态的最佳方法是通过

$("#input").prop('disabled', true); 
$("#input").prop('disabled', false);

请查看此链接以获取完整说明. 使用jQuery禁用/启用输入？