删除css悬停样式

Jam*_*ord 11 html css jquery dhtml

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

CSS:

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

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?
            }
        }
    );
Run Code Online (Sandbox Code Playgroud)

KRy*_*yan 20

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

.has-hover:hover
{
    /* do whatever */
}
Run Code Online (Sandbox Code Playgroud)

然后你的JavaScript做到了这一点:

$(this).children('a').removeClass('has-hover');
Run Code Online (Sandbox Code Playgroud)

您无法删除该类,:hover但您可以删除has-hover该类,并且由于该规则同时需要两者,因此将阻止应用该.has-hover:hover规则.