Question

我有一个表，其值是使用PHP动态生成的。表格中的每一行都有一个复选框。在表中是一个标题列，它有一个“全部接受”按钮。

当用户点击“全部接受”按钮时，将选中所有选择框。但是，我想添加一个类似toggle的功能：如果没有选中框，则按下按钮选择全部;如果选中所有框，则按下按钮将取消选中所有框。

这是我选择全部的JQuery代码：

//Approves all
$('#approve_all_questions').click(function () {
    $("INPUT[type='checkbox']").attr('checked', true);
});

我无法正确切换它。我试过这个：

//Toggle
$('#approve_all_questions').click(function () {

    if($("INPUT[type='checkbox']").attr('checked', true))
    {
        $("INPUT[type='checkbox']").attr('checked', false);
    }
    else
    {
        $("INPUT[type='checkbox']").attr('checked', true);
    }
  });

但这不起作用。

TIA。

Answer 1

$("INPUT[type='checkbox']").attr('checked', true)将checked属性设置为true，并返回一个始终评估为true的jQuery对象。

也许你想要

$("input[type='checkbox']").prop('checked', function(i, val) {
    return !val;
});

反转每个复选框的checked值。

如果您想一次选择或取消选择所有内容，您可以执行以下操作：

var $boxes = $("input[type='checkbox']"),
    $unselected = $boxes.not(function(){ 
        return this.checked;
    });

// if there are any unselected boxes, it selects all, else it deselects all
$boxes.prop('checked', $unselected.length > 0);

Answer 2

http://jsfiddle.net/6mK9q/1/

只需要一个参数，第二个将checked设置为true并返回object（被认为是true）

Answer 3

这是另一块代码，有一个工作演示：http://jsbin.com/agomuc/edit 请注意使用.live()，如果您想使用.click()，则必须将处理程序放入

$(document).ready(function(){ // handler here });

Answer 4

我更喜欢我的解决方案：

$(".selectAllCheckBox").live("click", function() {
    $("input[type='checkbox']").each(function() {
        if($(this).attr('checked')){
            $(this).attr('checked', false);
        } else {
            $(this).attr('checked', true);
        }
    });
});

）

如何使用JQuery切换所有复选框

4 个答案: