删除onmouseover和onmouseout上的属性

Question

我正在尝试使用JQuery的remove属性，如下所示：

$('#rom-img_1').removeAttr('mouseover');
$('#rom-img_2').removeAttr('mouseout');

但是，它不会消除事件的影响，因为鼠标悬停和鼠标移动时仍会触发事件。我曾尝试在事件名称之前添加“on”，但JQuery不会那样使用它。

为什么这不起作用，如何删除这些属性。

这有点像HTML：

<div onmouseout="$('#heart_401').css({'display':'none'});" onmouseover="$('#heart_401').css({'display':'block'});" id="row-img_11"></div>

感谢大家的帮助

Answer 1

永远不要使用html代码中的onsomething注册事件处理程序。它使您的标记可读性降低并导致各种问题（例如this未指向该元素。）

始终使用$(...).mouseover(function() { /* yourcode */ })或$(...).bind('mouseover', function() { /* yourcode */ })注册它们。

然后，您可以使用$(...).unbind('mouseover')轻松删除该句柄。

当然，您也可以使用点击或焦点等其他处理程序，而不是鼠标悬停。

removeAttr不起作用的原因是处理程序不是属性。在内部，它们被转换为处理程序，因此您无法通过删除属性来删除它们。 但是，这可能有效：

$('#rom-img_1')[0].mouseover = function() {};
$('#rom-img_1')[0].mouseout = function() {};

Answer 2

$('#rom-img_1')

你拼写错误row-img_11。 jQuery没有错误，只是得到一个没有匹配的选择器结果。

虽然您通常希望避免使用这样的内联事件处理程序属性，但removeAttr onmouseover的{​​{1}}对我有用。

Answer 3

要在jQuery中获取和设置mouseover和mouseout事件，请使用.mouseover()和.mouseout()。语法如下：

设置（在这种情况下删除）：

$("#row-img_11").mouseover("");
$("#row-img_11").mouseout("");

• http://api.jquery.com/mouseover/
• http://api.jquery.com/mouseout/

将方法应用于一组div：

$("div:contains('row-img')").each(function() {
    $(this).mouseover("");
    $(this).mouseout("");
});

Answer 4

如果您只是拼写正确的ID，它可以正常工作：

$('#row-img_11').removeAttr('onmouseover').removeAttr('onmouseout');