我在使用 jquery 时遇到背景颜色更改问题。
当页面首次加载并且用户将鼠标悬停在表格行上时，表格行的背景会发生变化。
一旦用户点击表格行单元格生成一个jquery弹出窗口，弹出窗口所属行的背景颜色就会改变。
用户通过单击文档上的任意位置关闭弹出窗口（使用 jquery），第一行提到的行的悬停突出显示功能被禁用，我需要它保持有效，只要没有任何弹出窗口打开。
这是我尝试添加到我的 jquery 中的内容，它一直有效，直到其中一个弹出窗口显示一次。换句话说，下面的代码只触发一次，而不是像我需要的那样保持有效：
if($(".webpopup,.phonepopup").is(":hidden")){
$("tr").hover(function(){
$(this).toggleClass('fresh');
});
}
js 小提琴：
【问题讨论】：
试试!important:
.fresh{background-color:#ddd !important;}
$("tr").hover(function(){
$(this).addClass('fresh');
}, function() {
$(this).removeClass('fresh')
});
这样的？
$("tr").hover(function(e){
if ($(".webpopup, .phonepopup").is(":visible")) {
return false;
}
$(this).addClass('fresh');
}, function() {
$(this).removeClass('fresh');
});
【讨论】：
在我看来，单击单元格后悬停不起作用。相反，看起来您在单击表格单元格时将背景设置为默认白色：
$(document).click(function() {
$("#favorites-table tr").css({
"background-color": "#fff" // <--- this part
});
$(".webpopup, .phonepopup").hide();
});
由于内联样式优先于类样式，您永远不会看到悬停效果，因为它被您设置的背景颜色隐藏了。
【讨论】：
您需要将其基于您的“新鲜”课程。
类似的东西
$("#favorites-table tr").css({
"background-color": "#fff"
});
添加一个内联样式，它胜过 css 类。
改用addClass 和removeClass
【讨论】：
其他贡献正确地指出，您需要使用类而不是内联颜色，但正如 MHZ 一直所说，这并不是所需的全部功能。悬停的问题在于它尝试测试可见性的方式不正确。考虑可见性的原始测试：
if($(".webpopup,.phonepopup").is(":hidden")){
$("tr").hover(function(){
$(this).toggleClass('fresh');
});
}
if 函数将始终返回 true。然后，由于它始终为真，它将创建悬停事件。这发生一次，在文档加载时。然后你就被这个事件监听器困住了。
相反，MHZ，我认为您需要类似以下内容：
theyAreVisible = function() {
var shown = $('.webpopup,.phonepopup').map(function() {
return $(this).is(':visible') ? true : null;
});
return shown.length > 0 ? true : false;
};
$("tr").hover(function() {
if (!theyAreVisible()) $(this).addClass('fresh');
}, function() {
if (!theyAreVisible()) $(this).removeClass('fresh');
});
这样，您就有了一个悬停事件处理程序，用于检查是否有任何弹出窗口打开。 map 函数将遍历每一个并查找是否有任何个人是打开的，如果找到则返回 true。但是我们不能只返回这个结果，因为 if([]) 将解析为 true。考虑：
if ([]) { console.log('yup!'); }
外卖：
【讨论】：