当任何Ajax请求完成时触发一个事件
我期待从各个请求本身之外的所有ajax请求中收听onComplete事件。当任何Ajax请求完成时触发一个事件
我想在任何/所有ajax请求完成时触发一个事件。
这可能吗?
在此先感谢,蒂姆
编辑:要求mootools的仅LIB(V1.4)
这可能会非常棘手:
$(document).ajaxComplete(function() {
$(this).text('Triggered ajaxComplete handler.');
});
看看。代码很简单。我对单个请求原变化选择是从mootools的,更Class.refactor
,如果有的话:
// enable log func...
Class.refactor(Request, {
success: function(text, xml){
this.previous(text, xml);
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
},
failure: function(){
this.previous();
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
}
});
和公共位 - 这是一样的,你去哪个方式。
// assign a logger function
Request.monitor = function() {
console.log("onComplete", this.response.text);
};
// call a simple request object.
new Request({
url: "/echo/html/",
method: "post",
data: {
html: "hello"
}
}).send();
原因是:它将独立于mootools核心变化而工作。它不关心的功能代码功能是什么,它将原有的运行后我们并不会打破,除非有在未来
您也可以通过implement
改变类,而不是一个巨大 API的变化,尽管这亿韩元” t说明了mootools-core的变化,但可能是这样。在实践中,这意味着,复制和粘贴方法目前FUNC并添加到它 - 幸运的是,我们要短方法国防部:
Request.implement({
success: function(text, xml){
this.onSuccess(this.processScripts(text), xml);
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
},
failure: function(){
this.onFailure();
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
}
});
最后,你甚至可以保存旧的低水平var oldsuccess = Request.prototype.success
,做你的事它和oldsuccess.apply(this, arguments)
它。
困难在于Request的子类如HTML和JSON - 如果已经定义好了,它们将复制旧的原型,并且您的记录器将会执行此操作。您可以改为将其作为一个小对象并将其实施到所有Request类中。
像这样优雅可以工作,但只有在成功的方法是在代码相同,否则 - 它会在子类中打破的东西:
(function() {
var changes = {
success: function(text, xml){
this.onSuccess(this.processScripts(text), xml);
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
},
failure: function(){
this.onFailure();
Request.monitor && typeof Request.monitor == "function" && Request.monitor.apply(this, arguments);
}
};
[Request, Request.HTML, Request.JSON].invoke('implement', changes);
})();
最后一个方法+原稿原的组合是什么你真的需要成功funcs不同所有3 ...
编辑这是越来越荒谬。像我说的,不是最简单的任务...
这可能是我在生产,测试和使用所有3个类的最终版本/重构。请记住所做的方法是在JSON或HTML进行额外解析之前完成的。它是低级别的日志记录。否则,请重构onSuccess和onFailure。
(function() {
// what we will extend
var classes = [Request, Request.HTML, Request.JSON],
// map to a text name
mapper = ["Request", "Request.HTML", "Request.JSON"],
// store reference to original methods
orig = {
onSuccess: Request.prototype.onSuccess,
onFailure: Request.prototype.onFailure
},
// changes to protos to implement
changes = {
onSuccess: function(){
Request.Spy && typeof Request.Spy == "function" && Request.Spy.apply(this, arguments);
orig.onSuccess.apply(this, arguments);
},
onFailure: function(){
Request.Spy && typeof Request.Spy == "function" && Request.Spy.apply(this, arguments);
orig.onFailure.apply(this, arguments);
}
};
classes.invoke('implement', changes);
// allow us to tell which Class prototype has called the ajax
Request.implement({
getClass: function() {
var ret;
Array.each(classes, function(klass, index) {
if (instanceOf(this, klass)) {
ret = mapper[index];
}
}, this);
return ret;
}
});
})();
// to enable spying, just define Request.Spy as a function:
Request.Spy = function() {
console.log(this.getClass(), arguments);
};
// test it via normal Request
new Request({
url: "/echo/html/",
data: {
html: "normal data"
}
}).send();
// test via HTML
new Request.HTML({
url: "/echo/html/",
data: {
html: "<p>normal data</p>"
}
}).send();
// test via JSON
new Request.JSON({
url: "/echo/json/",
data: {
json: JSON.encode({'normal':'data'})
}
}).send();
的jsfiddle:http://jsfiddle.net/dimitar/3rnKe/
编辑:解决方案适用于jQuery的。不是MooTools。如果你想只观察和拦截http://api.jquery.com/ajaxComplete/
对不起的人就是jQuery的我找mootools的。 – 2012-02-09 17:33:40
但是,如果它尚不存在,那么可以检查移植到mootools的资源。 – 2012-02-09 17:34:23
哎呦。对不起,这个......我有点快,并且错过了mootools的标签。 – osahyoun 2012-02-09 19:28:48
迪贝尔一如既往,你是男人!谢谢你的分解,我会在未来几天测试并重新发布我的发现,THX再次! – 2012-02-09 21:50:03
's ok给了我更多的东西放在我的博客:) – 2012-02-09 22:03:58
在最终版本重构我改变了proto.implement Klass.implement和一切都很棒。通过Request,Request.HTML,Request.JSON进行测试。对于任何正在观察这个Request.monitor的人来说,都会在你的函数中将请求对象作为“this”传递,并且你将拥有任何东西/任何东西。再次感谢! – 2012-02-09 22:38:31