Fatal编程技术网
  • javascript/
  • Javascript jQuery.unbind删除使用$.proxy创建的错误处理程序

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

javascript jquery

Javascript jQuery.unbind删除使用$.proxy创建的错误处理程序,javascript,javascript-events,jquery,microsoft-ajax,Javascript,Javascript Events,Jquery,Microsoft Ajax,我有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

我有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>


var ClientControl=函数（）{
//这里有一些特定于实例的代码
};
ClientControl.prototype={
初始化：函数（）{
this.documentClickedDelegate=$.proxy（this.documentClicked，this）；
//this.documentClickedDelegate=Function.createDelegate（this，this.documentClicked）；//来自MicrosoftJax
},
绑定：函数（）{
$（document）.bind（“单击”，此.documentClickedDelegate）；
},
解除绑定：函数（）{
$（document）.unbind（“单击”，此.documentClickedDelegate）；
},
documentClicked:function（）{
警报（“单击文档！”）；
}
};
var Control1=new ClientControl（）；
Control1.initialize（）；
var Control2=new ClientControl（）；
Control2.initialize（）；
Control1.bind（）；
Control2.bind（）；
控件1.unbind（）；
//Control2的documentClickedDelegate处理程序（如果使用$.proxy创建）已解除绑定！
因此，问题是，当调用第一个Control1对象的unbind（）方法时，如果使用$.proxy（）方法创建这两个对象的documentClickedDelegate处理程序，它将解除这两个对象的绑定。 所以jquery事件系统认为这些处理程序是相同的，尽管传递给$.proxy（）方法的上下文不同

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

事实证明，$.proxy为传递的不同上下文创建相同的代理函数。从官方网站：

但是，请注意，jQuery的事件绑定子系统会分配 每个事件处理函数的唯一id，以便在事件发生时跟踪它 用于指定要解除绑定的函数。函数 由jQuery.proxy（）表示的函数被 事件子系统，即使它用于绑定不同的上下文 为避免解除绑定错误的处理程序，请为其使用唯一的事件命名空间 绑定和解除绑定（例如，“click.myproxy1”），而不是指定 解除绑定期间的代理函数。”

在我的例子中，这是不应该做的，因为名称空间分隔特定于类型的事件，而不是特定于实例的事件

下面是屏幕截图，您可以看到，$。代理创建具有相同的GUID=1和函数的处理程序。createDelegate创建具有不同GIUD的处理程序：GUID=1和GUID=2

所以，当在第一种情况下删除一个时，它同时删除了两个，这是不应该做的

我的问题是：jquery中是否有对Function.createDelegate的模拟？我不想为了一个功能而使用另一个微软JAX库。
或者这个问题的任何通用解决方案——如何告诉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!");
    }
}
这是一个例子。单击文档上的任意位置，您将收到一个警报。如果没有名称空间，您将得到2