具有连续调用的jquery事件委派变量作用域
使用jQuery1.6中的事件委派,您可以响应已冒泡到公共父级的事件 示例实现如下所示:具有连续调用的jquery事件委派变量作用域,jquery,scope,event-delegation,Jquery,Scope,Event Delegation,使用jQuery1.6中的事件委派,您可以响应已冒泡到公共父级的事件 示例实现如下所示: (function($){ $.fn.myeventhandler = function () { return this.delegate('a.next, a.prev', 'click customEvent', function (event) { var target=$(event.target); var bar = null; i
(function($){
$.fn.myeventhandler = function () {
return this.delegate('a.next, a.prev', 'click customEvent', function (event) {
var target=$(event.target);
var bar = null;
if('click' == event.type) { /*~[ call this 'a' ]~*/
// handle the click event
$('#next-element').animate({width:'200px'},1300,function(){
bar = 'value1';
$('#next-element').animate({width:'100px'},1300,function(){
bar = 'value2';
console.log(bar);
});
});
} else if('customEvent' == event.type) { /*~[ call this 'b' ]~*/
// handle the customEvent event
$('#my-element').animate({height:'200px'},1300,function(){
bar = 'my-event1';
console.log(bar);
});
}
return false;
});
}
})(jQuery);
当您希望在页面上绑定许多事件触发器时,这种结构可以非常好地工作。然而,我注意到了一种奇怪的行为,并想知道是否有人能在以下范围内启发我:
如果定义变量“var bar”在“a”之前编码>,并在“a”中使用它,并且“a”需要很长时间才能执行,那么如果第二次触发“click”,是会重新分配“bar”变量的值,还是会创建一个新的变量
这个问题的原因是我有一个“未完成”的动画,动画需要1.3秒才能完成。如果触发两个连续的单击事件,则正确设置了目标和类型,但第二个动画似乎影响了第一个动画,并且两个作用域似乎彼此可用
我还没有完成动画,所以我还没有一个工作集可以放在JSFIDLE中联机,但是这里有没有什么经验法则可以让我研究,或者有人可以找到一些关于范围的更清晰的解释
编辑:
在上面,我添加了一个类似于我正在使用的情况。在上面的简化案例中,“bar”的值仍然保持两个连续调用的预期值,但在更复杂的案例中,我正在处理(仍然),除非我将参数专门传递到回调函数中,仍然有一个条件允许两个连续调用更改参数的值,以便回调看到由后续调用创建的值,而不是在其自己的触发调用中逻辑设置的值。如果有人能在一个简化的例子中复制这种效果,我将不胜感激。我正在缩减我的函数,试图生成一个复制它的JSFIDLE
谢谢,
AE传递事件对象,而不是使用各种事件新创建的对象,因此,“a”不会被重新分配,但会受到两个事件操作的影响。如果再次单击它,则会创建一个新的bar变量,两个bar值将相互独立。为了在行动中看到这一点,我创建了一个。快速单击两次,您会注意到第二个时间条采用默认值,而不是初始条变量所具有的值,这是预期值 嗨,星际编码器,评论中的“a”指的是第一个if()代码块,“b”指的是“else”代码块-抱歉,如果评论没有帮助-有什么好的例子可以更好地说明它?嗨@swatkins,我不确定我是否遵循了你的意思。有趣的是,链接(修改)表明,当第二个事件出现时,bar变量并没有被闪击,在我尚未完成的代码中,我可以在后续调用中影响if循环中的变量。我将再次尝试我的变量名,看看是否有一个单独的问题在起作用。好吧,在小提琴中,你有count
在全局空间中。因此,它根本不与事件对象绑定-事件对象正在修改计数
,这就是为什么此小提琴按预期工作的原因。但是,如果在单击操作的回调函数中声明count
,则每次单击时都会重新声明。事件对象本身是相同的(属性值不同),但在每个操作中都会重新声明声明特定的变量。下面是jQuery事件对象的文档视图:这是一个很好的例子(稍微编辑一下,以便更接近问题,没有外部变量作用域),说明一个调用如何不影响另一个调用。我还没有看到我做了什么导致了它,但它看起来更像是一个错误,而不是一个范围问题。您能否扩展范围本身并解释每个事件触发器上发生的情况?它是独立的吗?