禁用：单击鼠标hover

我有一个hover的div ：

 .div { // css } .div:hover { // css } 

但是我想在你点击div时禁用hover。

Answer 1

选项1. Javascript解决方案

只需添加一个禁止在点击时应用hover样式的类：

 $('div').on('click', function() { // when you click the div $(this).addClass('no-hover'); // add the class 'no-hover' }); 

 div { color: blue; } div:not(.no-hover):hover { /* only apply hover styling when the div does not have the class 'no-hover' */ color: red; } 

  
hover! 

Answer 2

你需要的只是这个：

 $('[your selector]').css({'pointer-events': 'none'}) 

Answer 3

试试这样：

 $('#myid').on({ mouseover: function(){ $(this).css({background: '#F94'}); }, mouseleave: function(){ $(this).css({background: '#DDD'}); }, click: function(){ $(this).off('mouseleave'); } }); 

JSFIDDLE DEMO

Answer 4

试试这个：

JQUERY

 $(function() { //run when the DOM is ready $(".div").click(function() { //use a class, since your ID gets mangled $(this).addClass("active"); //add the class to the clicked element }); }); 

CSS

 .div.active:hover { cursor:default; //same CSS as the DIV }