stopObserving
Event.stopObserving(element, eventName, handler[, useCapture = false])
注销事件处理程序。
该方法具有与 observe 在语义上完全一致的参数。它用于注销一个事件处理程序, 注销后这个元素事件的组合将不会被再次调用。
为什么不会停止调用?
为使 stopObserving
正常工作,必须传入与调用相关的 observe
注册事件时 完全相同的参数。
这看起来似乎很简单,但是编写代码时经常会出现类似下面的一种常见错误:
var obj = {
…
fx: function(event) {
…
}
};
Event.observe(elt, 'click', obj.fx.bindAsEventListener(obj));
…
// 这是错误的,不能这样做
Event.stopObserving(elt, 'click', obj.fx.bindAsEventListener(obj)); // 不会工作
这里,乍看起来似乎非常正确,但是你必须记住,bindAsEventListener
会返回一个封装了你的方法的全新的匿名函数。这就是说每次调用 bindAsEventListener
都会返回一个新的函数。
因此,上面的代码是在另一个函数上请求停止事件处理程序,而不是在注册事件时的初始函数上。找不到相匹配的函数,
自然不会解除当初所注册的事件处理程序。
为避免发生这种情况,你需要“缓存”绑定的函数(就像 script.aculo.us 库在许多类上所做的一样),类似于下面的代码:
var obj = {
…
fx: function(event) {
…
}
};
obj.bfx = obj.fx.bindAsEventListener(obj);
Event.observe(elt, 'click', obj.bfx);
…
Event.stopObserving(elt, 'click', obj.bfx);