jQuery的设定处理的顺序

我有一个类的DIV MyClass的我要挂钩最多两个处理器。 这个类是动态生成的,这是我在做什么:

$('#MainDiv').on({ click: function () { Handler1($(this)); } }, '.MyClass'); $('#SpecialChildDiv').on({ click: function () { Handler2($(this)); } }, '.MyClass');

我如何控制哪些处理程序首先调用?Handler2做一些额外的工作,但因为它不是在SpecialChildDiv它不是在每一个MyClass的调用。 我想处理程序2被调用后Handler1。

谢谢。

--------------解决方案-------------

因为SpecialChildDiv是推测的后代MainDiv ,将首先被调用。 这是因为该事件从目标冒泡,并调用沿着该顺序的方式向上发现处理程序。

一种可能性是使呼叫Handler2SpecialChildDiv使用异步处理setTimeout

$('#MainDiv').on({
click: function () {
Handler1($(this));
}
}, '.MyClass');

$('#SpecialChildDiv').on({
click: function () {
setTimeout($.proxy(function() {
Handler2($(this));
}, this), 0);
}
}, '.MyClass');

因此,处理程序本身会马上调用,但你的Handler2功能不会直到运行后Handler1被调用。

我还用$.proxy保持正确的this在,你传递给函数值setTimeout



一点题外话,但你可以,如果你改变你的代码更清洁Handler1Handler2使this是不是把它当作参数传递给元素的引用,...

$('#MainDiv').on({
click: Handler1
}, '.MyClass');

$('#SpecialChildDiv').on({
click: function () {
setTimeout($.proxy(Handler2, this), 0);
}
}, '.MyClass');

你只需要做$(this)你的函数里面包裹的元素在一个jQuery对象。 虽然这可能不是有用的,如果有其他的参数来传递。



根据您在下面的评论,似乎这种技术将需要应用到各个后代元素。

干涸的代码,你可以为你的点击处理程序的工厂...

function async_handler_factory(the_handler) {
return function() {
setTimeout($.proxy(function() {
the_handler($(this));
}, this), 0);
};
}

...然后使用它像这样...

$('#MainDiv').on({
click: Handler1
}, '.MyClass');

$('#SpecialChildDiv').on({
click: async_handler_factory(Handler2)
}, '.MyClass');

$('#AnotherChildDiv').on({
click: async_handler_factory(Handler3)
}, '.MyClass');

所以这是同样的原则。 只是,你通过HandlerN功能async_handler_factory ,它会创建并返回一个click处理函数,它通过调用不一样的我原来的代码HandlerNsetTimeout



只是为了避免混淆约$.proxy ,这里是消除它的更新版本。

function async_handler_factory(the_handler) {
return function() {
var self = this;
setTimeout(function() {
the_handler($(self));
}, 0);
};
}

这表明,它实际上是setTimeout是使您的解决方案的工作。



编辑:对于曾有不同的名称async_handler_factory在不同的地方。 固定。

所以不要呼吁点击第二个 - 称它为第一处理程序完成后:

$('#MainDiv').on({
click: function (e) {
Handler1($(this));
if ($(e.target).attr('id')==="SpecialChildDiv") {
specialChildClick();
}
}
}, '.MyClass');

specialChildClick = function () {
Handler2($('#SpecialChildDiv'));
}

分类:jQuery的 时间:2015-03-15 人气:0
本文关键词: jQuery的
分享到:

相关文章

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.400 (s). 10 q(s)