Question

在这个jsFiddle中，我在第一列中有一个带有复选框的表。表格标题中的主复选框按预期在单击表格时切换表格中所有复选框的状态。

我为 Shift + X 设置了一个热键来切换主复选框。使用热键时所需的行为是：

切换主复选框
子复选框的每个复选框都设置为与主

但实际发生的事情恰恰相反......

子复选框的每个复选框都设置为与主
切换主复选框

以下是相关代码

$(".master-select").click(function(){
    $(this).closest("table").find("tbody .row-select").prop('checked', this.checked);
});

function tickAllCheckboxes() {
  var master = $(".master-select").click();
}

//using jquery.hotkeys.js to assign hotkey
$(document).bind('keydown', 'shift+x', tickAllCheckboxes);

这导致子复选框具有与master复选框相反的选中状态。为什么会这样？修复会很好，但我真的在解释之后才能理解正在发生的事情。

Answer 1

试试这个

$(".master-select").click(function(){
    var checked = true;
    if(this.checked){
        checked = false;
    }
    $(this).closest("table").find("tbody .row-select").prop('checked', checked);
});

问题是您实际上不是clicking the checkbox，而是triggering it。因此，只要您触发它，复选框的状态就会处于以前的状态。

您需要处理触发器和手动点击 ..

的逻辑

试试此代码

$(".master-select").click(function(e) {
    var checked;
    if (e.isTrigger) { // Logic when click is triggered
        checked = true;
        if (this.checked) {
            checked = false;
        }
    }
    else {  // Explicit click 
       checked = this.checked;
    }

    $(this).closest("table").find("tbody .row-select").prop('checked', checked);
});

<强> Check Fiddle

切换复选框的热键相反

1 个答案: