如何删除：hover？
我的脚本有一个小问题。
我希望有一个默认操作:hover为禁用Javascript的客户端，但对于那些启用了Javascript的人我想要另一个动作（实际上……同样的动作，但我想添加一个小的过渡效果）。
那么……我怎么能这样做？ 我正在使用jQuery。
将两个类应用于relvant元素。 一个包含hover行为，一个包含所有其他样式。
然后，您可以使用jquery
$(element).removeClass('hover');
使用hover行为删除类的方法，然后应用您想要的任何内容
$(element).bind('mouseover', function () { doSomething(); }); $(element).bind('mouseout', function () { doSomething(); });
将:hover回退放在仅在禁用javascript时加载的样式表中怎么样？
这是一个没有黑客类的解决方案：
CSS：
a {color: blue;} a:hover {color: red;}
jQuery（使用jQueryUI为颜色设置动画）：
$('a').hover( function() { $(this) .css('color','blue') .animate({'color': 'red'}, 400); }, function() { $(this) .animate({'color': 'blue'}, 400); } );
演示
我认为最好的方法是将:hover行为留作非javascript用户的后备，然后使用JQuery创建mouseover和mouseout事件处理程序，为启用javascript的用户创建不同的效果。
JQuery Javascript库 – 事件/鼠标hover
这是一个非常古老的问题，但我觉得要告诉那个modernizr提供了一种非常好的方法来实现这种后备。
只需在头部包含modernizr，您就可以执行以下操作：
.no-js a:hover { set background color and stuff like that for cases when no javascript is present }
另一方面，如果你想以另一种方式这样做，只在js存在时设置css
.js a:hover { set background color to default and the text decoration }
它与向标记添加hover标记或多或少是相同的解决方案，但更加强大。
我找到了你的解决方案
基本上你是从重新定义你用csshover所做的事情开始的。 （当然你会通过从样式中动态提取信息来实现这一点）然后使用mouseover / mouseout事件在jquery中执行任何操作
这允许你在你的css中保留：hover事件，因为jquery将你的原始样式绑定到元素。 本质上禁用：hover事件。
如果你的css是：
a.class { background-color: #000000; background-position: 0 0; } a.class:hover { background-color: #ffffff; background-position: 100% -50px; }
你的jquery会是这样的：
jQuery("a.class").each(function () { var oldBackgroundColor = jQuery(this).css("backgroundColor"); var oldBackgroundPosition = jQuery(this).css("backgroundPosition"); jQuery(".class").css({ 'backgroundColor':oldBackgroundColor, 'backgroundPosition':oldBackgroundPosition }); }) .bind("mouseover", function() { doSomething(); }) .bind("mouseout", function() { doSomething(); })
您可以使用单个css规则在整个文档中全局启用行为，然后在安装新事件处理程序时在javascript中的一个语句中禁用该规则。
在html body标签中添加一个类：
...
你的css中的默认行为，让我们说hover时的粗体链接：
body.use-hover a:hover font-weight: bold
在你的js中，运行时将删除默认行为并执行其他操作：
$(function() { $('body').removeClass('use-hover'); $('a').live('mouseover', function() { // Do something when hovered }).live('mouseout', function() { // Do something after hover is lost }); });
您可以从document.styleSheets中删除所有：hover样式规则。
只需使用JavaScript浏览所有CSS样式并删除所有在其选择器中包含“：hover”的规则。 我需要删除时使用此方法：bootstrap 2中的hover样式。
_.each(document.styleSheets, function (sheet) { var rulesToLoose = []; _.each(sheet.cssRules, function (rule, index) { if (rule.selectorText && rule.selectorText.indexOf(':hover') > 0) { rulesToLoose.push(index); } }); _.each(rulesToLoose.reverse(), function (index) { if (sheet.deleteRule) { sheet.deleteRule(index); } else if (sheet.removeRule) { sheet.removeRule(index); } }); });
我确实使用下划线来迭代数组，但是也可以用纯js循环编写那些：
for (var i = 0; i < document.styleSheets.length; i++) {}
You can redraw element after click function redraw(element) { if (!element) { return; } let n = document.createTextNode(' '); let disp = element.style.display; // don't worry about previous display style element.appendChild(n); element.style.display = 'none'; setTimeout(function(){ element.style.display = disp; n.parentNode.removeChild(n); }, 100); // you can play with this timeout to make it as short as possible
}