我有一张 table ,我想在鼠标悬停和鼠标按下时更改单元格背景,但我当前的解决方案无法正常工作:

function ChangeColor(sender) {

    sender.style.backgroundColor = 'yellow';

}

var clicking = false;


$(document).mouseup(function() {
    clicking = false;
});


$(document).ready(function() {
    $('#Table1 tr').each(function() {
        $('td', this).each(function() {
            $(this).mousedown(function() {
                clicking = true;
            });
            $(this).mousedown(function(event) {
                if (clicking==true) { ChangeColor(this); }
            });
        });
    });
});

有什么办法可以使它像这样工作吗?

最佳答案

编辑:鉴于以上评论,您可以执行以下操作:

$(document).ready(function() {
    isMouseDown = false

    $('body').mousedown(function() {
        isMouseDown = true;
    })
    .mouseup(function() {
        isMouseDown = false;
    });

    $('Table1 tr td').mouseenter(function() {
        if(isMouseDown)
            $(this).css({backgroundColor:'orange'});
    });
});

当您将鼠标悬停时,这将为td的背景上色,但前提是鼠标按钮处于按下状态。

听起来您只是想在单击时更改颜色。如果真是这样,它比您尝试的要简单得多。
$(document).ready() {

    $('#Table1 tr td').click(function() {
        $(this).css({backgroundColor:'yellow'});
    });

});

单击它们时,这会将td元素的背景更改为黄色。

鼠标悬停时,更改颜色将类似于此操作。

编辑:刚注意到您问题的标题。

如果要在悬停时触发点击...
$(document).ready() {

    $('#Table1 tr td').click(function() {
        $(this).css({backgroundColor:'yellow'});
    })
     .mouseenter(function() {
         $(this).click();
     });

});

...当然,在这种情况下,您可以消除click,而只需通过mouseenter事件更改背景即可。

10-05 21:55