javascript - 保存和恢复 jQuery 对象上的 "onclick"操作

Question

我想禁用页面上的一大堆对象，然后再重新启用它们。由于其中一些是标签而不是按钮，我通过删除它们的 onclick 属性来禁用它们。我试图将旧处理程序存储在 .data() 中，但不幸的是，当我尝试使用 $(obj).attr('onclick',$(obj).data('onclick') 恢复它们时)，它调用函数而不是将其还原为属性。如果我尝试将它存储在不同的属性而不是数据中，它不会存储函数，它会存储函数的返回值。

有没有什么方法可以在不重写我页面上的每个标记和每个 onclick 处理程序的情况下完成此操作？

if( doEnable) {

    $(obj).attr('href', $(obj).data('href'));
    $(obj).attr('onclick', $(obj).data('onclick'));


    $(obj).removeClass(EIS.config.classes.disabled);
    $(obj).show();

}
else {
    // Save the things you're going to remove
    $(obj).data('onclick', $(obj).attr('onclick'));
    $(obj).data('href', $(obj).attr('href'));

    $(obj).prop("href", null);
    $(obj).prop("onclick", null);

    $(obj).addClass(EIS.config.classes.disabled);
    $(obj).show();
   }

顺便说一下，这段代码似乎在 Chrome 和 Firefox 中运行良好，但仅在 IE8 中有时运行良好，而在 IE6 中则从不运行。不幸的是，客户端首先在 IE6 中进行测试。

Answer 1

$(obj).attr('onclick', ...

是不明确的，在不同版本的 jQuery 和不同的浏览器中有不同的结果。它可能不会做你想要的。您应该避免在事件处理程序上使用 attr。

问题是 onclick attribute 和 onclick property 之间的断开连接。过去，jQuery 试图掩盖属性和特性之间的区别，使用 attr 访问两者，但它们是完全不同的。这在 jQuery 1.6 中发生了变化，并在 1.6.1 中部分恢复，导致广泛的争议、困惑和不兼容。

对于很多属性来说，一个属性的值和对应的DOM属性是一样的；对于其他人，包括所有不是字符串的属性，它们都不是。事件处理程序当然不是:该属性是一个 Function 对象，而字符串属性可能是 (a) HTML 中 onclick="..." 属性的原始字符串，(b)什么都没有(如果 onclick 是从脚本分配给一个 Function 对象)或 (c) 不可用(在旧的 IE 中)。

要访问事件处理程序 Function 属性，请在 jQuery 1.6 中使用 prop():

$(obj).data('onclick', $(obj).prop('onclick'));
...
$(obj).prop('onclick', $(obj).data('onclick'));

或者只使用普通的旧 JavaScript，它实际上更简单且更具可读性； jQuery 在这里不会给你带来任何好处。

obj._onclick= obj.onclick;
...
obj.onclick= obj._onclick;

无论哪种方式，这都不会可靠地“禁用”元素，因为它们可以(如果您使用 jQuery，则很可能会)使用 addEventListener/attachEvent 而不是老式事件在其上注册其他事件监听器处理程序接口(interface)。