我有一张 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
事件更改背景即可。