让我说我有
<style>
#container:hover{background:red}
</style>
<div id="container"><input type="submit"></div>
当我将鼠标悬停在提交时,#container
仍为红色。我可以删除它:使用jquery悬停在输入鼠标悬停上吗?我不想更改bg $('#container').css('backgroundColor','color')
,我需要$('#container').removeAttr('hover')
。
答案 0 :(得分:21)
不幸的是,使用jQuery管理CSS伪类是不可能的。
我建议您操作类,如下所示:
<style>
.red:hover{background:red}
</style>
<div id="container" class="red"><input type="submit"></div>
<script>
$("#container").removeClass("red");
</script>
答案 1 :(得分:6)
您无法删除伪类规则,但可以使用事件绑定覆盖它们:
$("#container").on('mouseover', function () {
$(this).css('background', 'blue');
}).on('mouseout', function () {
$(this).css('background', whateverItIsNormally);
});
答案 2 :(得分:2)
这可能有点复杂,当然可以使用优化,但你可以使用到目前为止发布的组合:
jsFiddle:http://jsfiddle.net/psyon001/Vcnvz/2/
<style>
.red{background:red;}
</style>
<div id="container"><input type="submit"></div>
<script>
$('#container').on({
'mouseenter' : function(){
$(this).addClass('red');
},
'mouseleave' : function(){
$(this).removeClass('red');
}
});
$('#container').find('input').on({
'mouseenter' : function(){
$('#container').removeClass('red');
},
'mouseleave' : function(){
$('#container').addClass('red');
}
})
</script>
答案 3 :(得分:1)
取决于您的浏览器指针 - 事件:无可能帮助
https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events
答案 4 :(得分:0)
我申请了这个:
element.click(function(){
element.hover(
function(){
element.css('background-color', '');
element.css('color', '');
},
function(){
element.css('background-color', '');
element.css('color', '');
});
});
它似乎可以在保留原始CSS的同时删除悬停属性。
答案 5 :(得分:0)
我们可以借助css和Jquery覆盖CSS悬停效果
$('div').hover(function(){ $(this).addClass('nohover');})
In CSS Add Class .nohover
.nohover {
pointer-events:none;
}
答案 6 :(得分:0)
我认为这样更好
<style>
.red:hover { background-color:red; }
</style>
<!-- by default is On-->
<div class="box red"></div>
<script>
$('.box').click(function(){
$(this).toggleClass('red');
});
</script>