jquery - 为什么我的复选框总是未被选中？

Question

以下代码向调用节点添加一个复选框和一个标签。
我的问题在于 label.click 函数。每当单击标签时，我想更改匹配复选框的状态。然而，发生的情况是该复选框始终未被选中。 出于调试目的，我现在总是显式地将其设置为选中。

当我使用 firebug 单步执行代码时，我看到该复选框被选中，然后，当离开该函数时，它再次被取消选中。

有什么想法吗？

jQuery.fn.AddEndOrStartWith = function(selected, id, action) {
    var checkBox = $('<input type="checkbox"></input>');
    checkBox.attr("id", id + action);
    checkBox.addClass(action + "CheckBox");
    checkBox.attr("for", id);

    var label = $('<label></label>');
    label.attr("for", id + action);

    if (selected) {
        checkBox.attr("checked", "checked");
        label.addClass("lockerClosed");
    } else {
        label.addClass("lockerOpen");
    }

    $(this).append(label);
    $(this).append(checkBox);

    label.click(function() {
        /*alert(checkBox.attr("checked"));*/
        checkBox.attr("checked", "checked");
        /*return true;*/
        /*alert(checkBox.attr("checked"));*/
    });
}

Answer 1

您需要防止标签点击处理程序中的默认操作。认为这应该可以做到:

label.click(function() {
     checkBox.attr("checked", "checked");
     return false;
});

发生的事情是，因为您的标签设置了正确引用复选框的 for，所以单击它时的默认操作是切换复选框。

不过，嗯，如果这就是您尝试使用点击处理程序执行的全部操作，我想您甚至可以不使用点击处理程序。但我不确定是否是这样。