[英]How do I know when all AJAX calls from a particular functions are finished?
[英]How can I know when Ajax calls are finished with getScript?
我使用jQuery getScript
将X量的js文件加载到我的页面中。 每个JS页面都有一个AJAX调用,用于从数据库中获取数据。
我在getScript
上使用.done
方法来查看所有文件的加载时间,但我需要等到所有的AJAX调用都完成。
在getScript
之前,我怎样才能通过getScript
等待AJAX调用完成包含的文件?
$.getMultiScripts(moduleIncludes, 'includes/js/modules/').done(function() {
// All of the JS files have been included but we need to wait until those files have finished their AJAX call.
});
// Get array of JS scripts to load
$.getMultiScripts = function(arr, path) {
var _arr = $.map(arr, function(scr) {
return $.getScript((path || "") + scr);
});
_arr.push($.Deferred(function(deferred) {
$(deferred.resolve);
}));
return $.when.apply($, _arr);
}
你可以使用.ajaxStop()
每当Ajax请求完成时,jQuery都会检查是否还有其他未完成的Ajax请求。 如果没有,jQuery会触发
ajaxStop
事件。
$(document).on("ajaxStop", function() {
// do stuff when all `$.ajax()` call have complete
$(document).off("ajaxStop")
});
$.getMultiScripts(moduleIncludes, 'includes/js/modules/').done(function() {
// All of the JS files have been included but we need to wait until those files have finished their AJAX call.
});
另一种方法是使用$.when.apply()
两次。 也就是说,将ajax调用推入第二个数组
"module1.js"
data.push($.get("/path/to/module1-resource"))
var modules = ["module1.js", "module2.js", "module3.js"];
// declare global `data` array
data = [];
$.getMultiScripts = function(arr, path) {
var _arr = $.map(arr, function(scr) {
return $.getScript(scr)
});
return $.when.apply($, _arr.concat($.when()))
}
$.getMultiScripts(arr)
.then(function() {
console.log("getScript calls", arguments)
$.when.apply($, data).then(function() {
console.log("ajax calls", arguments)
})
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.