4

我的列标题中有一个 checkboc。单击它，所有复选框都需要被选中，并且在取消选中主复选框时，所有复选框都应该被取消选中。我用谷歌搜索了很多，但我只有这种事情的 javascript 代码。但我想要纯 JQuery 的东西。我在这里粘贴我的代码。现在单击主复选框，所有复选框都在检查，但主复选框本身可以有人帮助我使用 jquery 代码。

这是我的标题复选框：

<input type="checkbox" onclick="checkBoxChecked()" id="mastercheck" name ="mastercheck"/>

Onclick 方法是

function checkBoxChecked(){
         try{

        var checkboxes=document.getElementsByName("test");

        for(i=0;i<document.getElementsByName("test").length;i++)
        {
         checkboxes[i].checked = "checked";
        }

        }
        catch(e)
        {

        }

        document.getElementById("mastercheck").checked="checked";
        return true;

        }
4

8 回答 8

10

HTML：

<input type="checkbox" id="ckbCheckAll" />
    <p id="checkBoxes">
        <input type="checkbox" class="checkBoxClass" id="Checkbox1" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox2" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox3" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox4" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox5" />
        <br />
    </p>

查询：

$(document).ready(function () {
    $("#ckbCheckAll").click(function () {
        $(".checkBoxClass").prop('checked', $(this).prop('checked'));
    });
});

现场演示

于 2013-09-24T08:51:52.163 回答
3 
$(document).ready(function() {
    $("#mastercheck").click(function() {
        var checkBoxes = $("input[name=test]");
        checkBoxes.prop("checked", this.checked);
    });                 
});
于 2013-09-24T08:54:22.583 回答
1

复选框[i].checked = true;

如果这不起作用，您应该查看这个问题：以编程方式在 dashcode 中更改复选框的状态

于 2013-09-24T08:51:25.717 回答
1

你为什么不尝试这样的事情：

$('.master-checkbox').click(function(){
    var master_checkbox = $(this);
    $('input[type="checkbox"]').prop('checked', master_checkbox.prop('checked'));
});
于 2013-09-24T08:51:59.850 回答
1 
<b> <input type="checkbox" id="ckbCheckAll" /> Check/Uncheck me </b>
 <p id="checkBoxes">
        <input type="checkbox" class="checkBoxClass" id="Checkbox1" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox2" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox3" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox4" />
        <br />
        <input type="checkbox" class="checkBoxClass" id="Checkbox5" />
        <br />
    </p>

$(document).ready(function() {
      $('#ckbCheckAll').click(function(){
        var isChecked = $('#ckbCheckAll').is(':checked');
        if(isChecked)
        {
            $('.checkBoxClass').attr('checked', true);
        }

        else
        {
               $('.checkBoxClass').attr('checked', false); 
        }

      });
    });
于 2014-03-25T13:06:20.863 回答
1

你可以尝试这样的事情：

$('#mastercheck').on('change', function() {
  if ($(this).is(':checked')) {
    // Check all
    $('.childcheck').prop('checked', true);
  }
  else {
    // Uncheck all
    $('.childcheck').prop('checked', false);
  }
});
于 2013-09-24T08:52:05.163 回答
1

选中的属性应设置为true | false

于 2013-09-24T08:50:25.423 回答
1

尝试

function checkBoxChecked() {
    $('input[name=test]').prop('checked', $('#mastercheck').is(':checked'))
}
于 2013-09-24T08:50:14.877 回答