Question

我写了2个jquery函数。第1-11行是第一个在mousedown上绑定mouseover事件以获得单击和拖动以选择td（内部检查/取消选中复选框）的效果。

第二个功能（12-20）是单击并取消选中单个td以选中并取消选中一个复选框。我能够做mousedown并选择多个td，但我无法点击并取消单击td。我不确定问题出在哪里？任何建议表示赞赏。

以下是代码：

$("#tbl td").mousedown(function() {
    $("#tbl td").bind('mouseover', function() {
        var checkbox = $(':checkbox', this)[0];
        $(this).css({
            'background': (checkbox.checked ? 'white' : '#6D7B8D')
        });
        checkbox.checked = !checkbox.checked;
    });
    $(this).mouseover();
}).mouseup(function(event) {
    $("#td").unbind('mouseover');
    event.preventDefault();
    event.stopPropagation();
});

$('#tbl td').click(function(e) {
    if ($(this).find('input:checkbox').is(':checked')) {
        $(this).find('input:checkbox').attr("checked", "");
        $(this).css({
            background: "white"
        });
    } else {
        $(this).find('input:checkbox').attr("checked", "checked");
        $(this).css({
            background: "#6D7B8D"
        });
    }
});

由于

Answer 1

嗯，我不确定这是否是你真正需要的，但也许可以提供帮助。

（只是要知道，如果你输入HTML代码会非常有用！）

现场演示： http://jsfiddle.net/oscarj24/TATg7/

<强>代码：

$('#tbl').on('mousedown, mouseover, mouseup, click', 'td', function(e) {
    if(e.type == 'mousedown'){
        $(this).mouseover();
    } else if(e.type == 'mouseover'){
        var checkbox = $('input:checkbox');
        $(this).css({'background': (checkbox.is(':checked') ? 'white' : '#6D7B8D')});
        checkbox.prop('checked', !checkbox.checked);    
    } else if(e.type == 'mouseup'){
        $(this).unbind('mouseover');
        e.preventDefault();
        e.stopPropagation();
    } else if(e.type == 'click'){
        var checked = $('input:checked').is(':checked');
        checked ? background = 'white' : background = '#6D7B8D';
        $('input:checked').prop('checked', !checked);
        $(this).css({background: background});
    }
});

Jquery点击它时无法选择和取消选择td

1 个答案: