我理解表单读取很多帖子在ajax请求上的async = false实际上并不是ajax请求的方法。但是有没有办法让我知道差异决定使用哪一个或总是使用异步?
我目前面临着使用回调理解ajax和ajax以及何时使用回调的挑战。我有一个按钮,我点击这里,以便我可以将grialicious http://suprb.com/apps/gridalicious/
附加到我需要的项目#my-grid div container。但是,ajax请求将在返回我的项目后始终运行。因此,我现在唯一能够完成这项工作的方法是request.async=false
使其同步工作。但这种方法是正确的吗?或者有更好的方法来重构我的代码吗?
$('#loadMoreButton').click(function(){
var $grid = $('#my-grid').gridalicious('append',loadMoreUserFeed());
})
function loadMoreUserFeed(){
var loadMoreButton = $('#loadMoreButton')
var items = new Array;
var request = {
success: function(response){
$.each(response.results.items,function(){
myitem = document.createElement('div');
myitem.className = 'my-item';
items.push(myitem)
}
},
error: function(response){
debugger;
}
}
request.dataType= 'json';
request.contentType = 'application/json';
request.data = $(this).serialize();
request.scriptCharset = "utf-8";
request.url = '/my_url';
request.type = "GET";
request.async = true;
$.ajax(request);
return items;
}
当我使用request.async=false
时,我收到以下消息。但是当我执行request.async=true
时,在我的请求完成之前,我的项目列表之前将返回一个空数组。
Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience.
要异步还是不异步ajax请求?什么时候可以使用async = false?如果选择保持异步。我该如何构建ajax的执行?
修改
以下是我提出的一项建议更改,以启用async = true:
$('#loadMoreButton').click(function(){
loadMoreUserFeed()
})
function loadMoreUserFeed(){
var loadMoreButton = $('#loadMoreButton')
var items = new Array;
var request = {
success: function(response){
$.each(response.results.items,function(){
myitem = document.createElement('div');
myitem.className = 'my-item';
items.push(myitem)
}
$('#my-grid').gridalicious('append',items);
},
error: function(response){
debugger;
}
}
request.dataType= 'json';
request.contentType = 'application/json';
request.data = $(this).serialize();
request.scriptCharset = "utf-8";
request.url = '/my_url';
request.type = "GET";
request.async = true;
$.ajax(request);
}
但我不知道这是否是最佳方法。
编辑2
$('#loadMoreButton').click(function(){
loadMoreUserFeed(makeDivItems)
})
function loadMoreUserFeed(callback){
var request = {
success: function(response){
callback()
},
error: function(response){
debugger;
}
}
request.dataType= 'json';
request.contentType = 'application/json';
request.data = $(this).serialize();
request.scriptCharset = "utf-8";
request.url = '/my_url';
request.type = "GET";
request.async = true;
$.ajax(request);
}
function makeDivItems(){
var items = new Array;
$.each(response.results.items,function(){
myitem = document.createElement('div');
myitem.className = 'my-item';
items.push(myitem)
}
$('#my-grid').gridalicious('append',items);
}