如何选中复选框时禁用和取消选中复选框?

时间:2013-02-04 22:13:27

标签: jquery checkbox

我有一个jquery脚本,它禁用一行中的所有复选框并将它们标记为已选中:

$(function() {
  enable_cb();
  $("#group1").click(enable_cb);
});

function enable_cb() {
  if (this.checked) {
     $("input.group1").attr("disabled", true);
     $("input.group1").attr("checked", true);
  } else {
     $("input.group1").removeAttr("disabled","checked");

  }
}

这是我的小提琴:http://jsfiddle.net/3fksv/16/

我希望其余的复选框再次显示为活动状态,并在取消选中该复选框时取消选中。我在剧本中做错了什么?

3 个答案:

答案 0 :(得分:5)

checkeddisabled是属性,从用于修改元素属性的jQuery 1.6开始,应使用prop方法代替attr

function enable_cb() {
   $("input.group1")
         .prop("disabled", this.checked)
         .prop("checked", this.checked);
}

http://jsfiddle.net/JeqE5/

答案 1 :(得分:2)

我认为你不能一次删除两个属性。您可能必须使用两次调用removeAttr()函数 -

$("input.group1").removeAttr("disabled");
$("input.group1").removeAttr("checked");

正如@nickf正确提到的那样,这些命令也可以链接 -

$("input.group1").removeAttr("disabled").removeAttr("checked");

答案 2 :(得分:0)

DEMO:http://jsfiddle.net/3fksv/18/

function enable_cb() {
   if (this.checked) {
      $("input.group1").attr("disabled", 'disabled');
      $("input.group1").attr("checked", 'checked');
   } else {
      $("input.group1").removeAttr("disabled","checked");
   }
}

$(function() {
   $("input.group1").attr("disabled", 'disabled');
   $("input.group1").attr("checked", 'checked');
   $("#group1").click(enable_cb);
});