jQuery 删除css悬停样式

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12747903/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:59:01  来源:igfitidea点击:

remove css hover style

jqueryhtmlcssdhtml

提问by James Radford

I have mark up that toggles the hover css style using this rule. When there's a checkbox inside the panel I want to remove the background image style. Is this possible? I've tried the following although it fails.

我已标记使用此规则切换悬停 css 样式。当面板中有一个复选框时,我想删除背景图像样式。这可能吗?虽然失败了,但我已经尝试了以下方法。

CSS:

CSS:

   .StaffMode .day ul li.standard a:hover table {
        background:url("test.png"); 
    }

JS:

JS:

   $("li.test table li").hover(
        function () {
            if($(this).children(':checked')) {
              alert('need to remove the background image style');  // shows as expected
              $(this).children('a').removeClass('hover');  // this doesnt work?
            }
        }
    );

回答by KRyan

What you need to do is put some restriction on your :hoverrule, and have your JavaScript change the element so it no longer applies. Something like this:

您需要做的是对您的:hover规则进行一些限制,并让您的 JavaScript 更改元素使其不再适用。像这样的东西:

.has-hover:hover
{
    /* do whatever */
}

And then your JavaScript does this:

然后你的 JavaScript 会这样做:

$(this).children('a').removeClass('has-hover');

You can't remove the :hoverbut you can remove the has-hoverclass, and since the rule requires both, this will prevent the .has-hover:hoverrule from being applied.

您不能删除 ,:hover但可以删除has-hover类,并且由于规则需要两者,这将阻止.has-hover:hover应用规则。