我能否使用jQuery删除内联事件处理程序？

Question

我有一些带有 onclick 属性的 HTML。 我想使用 jQuery 覆盖该属性。 有没有办法使用 jQuery 删除点击处理程序？ 使用 unbind 不起作用。

- Skilldrick

---

我意识到，对于一个大型网站来说可能不太方便，但使用记事本/Textmate/Gedit（或任何其他文本编辑器）查找所有“onclick”（或onClick）的实例并将它们全部删除会更容易（且下载的代码带宽更轻）。 - David Thomas

@David - 我正在处理由Rails 2生成的内联垃圾代码。一旦我上传到Rails 3，我就不会有这个问题了，因为他们已经使所有JavaScript变得不突兀了。 - Skilldrick

我不能否定Rails（我从未真正尝试过），但是针对它生成的“内联垃圾”，我只能说呕呕呕... - David Thomas

@David - 老实说，我认为他们大部分东西做得很对，但是他们对内联JavaScript有一种痴迷的偏见，其中他们真的做错了。至少他们现在正在解决这个问题！ - Skilldrick

Answer 1

尝试使用.removeAttr()函数：

$(function() {
    $('a').removeAttr('onclick');
});

​这里有一个jsfiddle示例。

当你去掉了 onclick 属性后，可以附加自己的点击事件处理程序。

- Darin Dimitrov

---

我在一个标签上有一个js内联代码，点击时会提交一个表单，但我无法像你所提到的那样停止提交表单... - ratata

此解决方案可能无法在Internet Explorer 8、9和11中使用。请参见http://api.jquery.com/removeAttr/#entry-longdesc上的说明。来自Abhishek Sinha的解决方案更加稳定可靠。 - Kyborek

Answer 2

$("#theElement")[0].onclick = function() {
  whatever();
};
// -- or --
$("#theElement")[0].onclick = null;

并不是说 jQuery 会使标准的 DOM 函数和属性消失。;-)

- Tomalak

---

你是正确的，但 jQuery 函数的好处在于它们适用于所有元素，因此我可以从所有匹配的元素中删除 onclick，而无需查看它们。 - Skilldrick

从技术上讲，removeAttr() 也是一个循环。但我同意使用它比手动编写循环更方便。 - Tomalak

Answer 3

如http://api.jquery.com/prop/中所述，使用.removeAttr()无法在Internet Explorer 8、9和11中成功移除内联onclick事件处理程序。为避免潜在问题，请改用.prop()。

因此，可以这样做：

$(function() {
    $('a').prop('onclick', false);
});

- Abhishek Sinha

---

这段代码引用自http://api.jquery.com/removeAttr/，目前建议使用的代码是`$element.prop( "onclick", null );`。 - Kyborek

Answer 4

有一个针对此功能的插件，但只有在确实需要时才应使用它。该插件提供了调用旧函数或完全忽略它的选项。

jQuery Override 插件

$(divElementObj).override('onclick', 'click', function(...));

- aikeru

Answer 5

尝试了给定的选项，但只部分起作用，因为它们只删除了其中一个。

相反，我尝试了以下链接作为解决方法。我正在使用版本1.4.2。

jQuery("selector")
    .removeAttr("onclick").removeAttr("onmouseout").removeAttr("onmouseover");

- Abhay