gpt4 book ai didi

javascript - jQuery.unbind 删除使用 $.proxy 创建的错误处理程序

转载 作者:行者123 更新时间:2023-11-29 16:22:59 25 4
gpt4 key购买 nike

我有 JavaScript 类:

<html>

<head>
<script src="MicrosoftAjax.js" type="text/javascript"></script>
<script src="jquery-1.6.4.min.js" type="text/javascript"></script>

</head>

<body>

<script type="text/javascript">

var ClientControl = function () {
//some instance-specific code here
};

ClientControl.prototype = {
initialize: function () {
this.documentClickedDelegate = $.proxy(this.documentClicked, this);
//this.documentClickedDelegate = Function.createDelegate(this, this.documentClicked); // from MicrosoftAjax
},

bind: function() {
$(document).bind("click", this.documentClickedDelegate);
},

unbind: function() {
$(document).unbind("click", this.documentClickedDelegate);
},

documentClicked: function() {
alert("document clicked!");
}
};

var Control1 = new ClientControl();
Control1.initialize();
var Control2 = new ClientControl();
Control2.initialize();

Control1.bind();
Control2.bind();

Control1.unbind();
//Control2`s documentClickedDelegate handler, if created with $.proxy, already is unbound!

</script>
</body>
</html>

所以问题是,当调用第一个 Control1 对象的 unbind() 方法时,它会解除绑定(bind)两个对象的 documentClickedDelegate 处理程序,如果它们是使用 $.proxy() 方法创建的。所以 jquery 事件系统认为这些处理程序是相同的,尽管传递给 $.proxy() 方法的上下文不同。

如果 documentClickedDelegate 处理程序是使用 Function.createDelegate - MicrosoftAjax 库的方法创建的,则一切正常。处理程序不同。

事实证明,$.proxy 为传递的不同上下文创建了相同的代理函数。来自官方网站:

"Be aware, however, that jQuery's event binding subsystem assigns a unique id to each event handling function in order to track it when it is used to specify the function to be unbound. The function represented by jQuery.proxy() is seen as a single function by the event subsystem, even when it is used to bind different contexts. To avoid unbinding the wrong handler, use a unique event namespace for binding and unbinding (e.g., "click.myproxy1") rather than specifying the proxied function during unbinding. "

在我的例子中不应该这样做,因为 namespace 将特定于类型的事件分开,而不是特定于实例的事件。

这是屏幕截图,您可以在其中看到 $.proxy 创建具有相同 GUID = 1 的处理程序,而 Function.createDelegate 创建具有不同 GIUD 的处理程序:guid = 1 和 guid = 2

enter image description here

enter image description here

enter image description here

enter image description here

所以当在第一种情况下删除一个时,它会删除两个,这是不应该做的!

我的问题是:jquery 中是否有与 Function.createDelegate 类似的东西?我不想将整个另一个 MicrosoftAjax 库仅用于一个功能。或者这个问题的任何通用解决方案 - 如何告诉 jquery 处理程序是不同的。感谢您的回答。

最佳答案

您确实需要为事件命名空间。简单的例子:

var counter = 0;

ClientControl.prototype = {
initialize: function () {
this.documentClickedDelegate = $.proxy(this.documentClicked, this);
this.num = counter++;
},
bind: function() {
$(document).bind("click.proxy" + this.num, this.documentClickedDelegate);
},
unbind: function() {
$(document).unbind("click.proxy" + this.num, this.documentClickedDelegate);
},
documentClicked: function() {
alert("document clicked!");
}
}

这是一个 working version .单击文档上的任意位置,您会收到一个警报。如果没有命名空间,你会得到 2。

关于javascript - jQuery.unbind 删除使用 $.proxy 创建的错误处理程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9157101/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com