while循环使用jQuery异步AJAX调用
事情：我有一个页面，它必须显示未确定数量的图像，通过AJAX（在服务器端使用base64编码）逐个加载。
var position = 'front'; while(GLOB_PROCEED_FETCH) { getImageRequest(position); } function getImageRequest(position) { GLOB_IMG_CURR++; $.ajax({ url: urlAJAX + 'scan=' + position, method: 'GET', async: false, success: function(data) { if ((data.status == 'empty') || (GLOB_IMG_CURR > GLOB_IMG_MAX)) { GLOB_PROCEED_FETCH = false; return true; } else if (data.status == 'success') { renderImageData(data); } } }); } 问题是只有在获取所有图像时，图像（使用renderImageData（）函数构造）才会附加（全部在一起）到特定的DIV。 我的意思是，在循环结束之前，没有任何DOM操作可能。
我需要逐个加载和显示图像，因为可能有大量的图像，所以我不能将它们堆叠起来，直到它们都被取出。
您最好的选择是重构代码以使用异步ajax调用，并在第一个调用完成时启动下一个调用，依此类推。 这将允许页面在图像提取之间重新显示。
这也将为浏览器提供呼吸和照顾其他内务的机会，而不是认为它可能被锁定或挂起。
并且，使用async: 'false'是一个坏主意。 我认为没有理由为什么结构正确的代码不能在这里使用异步ajax调用而不是在你获取这些数据时挂起浏览器。
你可以用异步ajax这样做：
function getAllImages(position, maxImages) { var imgCount = 0; function getNextImage() { $.ajax({ url: urlAJAX + 'scan=' + position, method: 'GET', async: true, success: function(data) { if (data.status == "success" && imgCount <= maxImages) { ++imgCount; renderImageData(data); getNextImage(); } } }); } getNextImage(); } // no while loop is needed // just call getAllImages() and pass it the // position and the maxImages you want to retrieve getAllImages('front', 20);
此外，虽然这可能看起来像递归，但由于ajax调用的异步性质，它并不是真正的递归。 getNextImage()实际上已在完成下一个调用之前完成，因此它不是技术上的递归。
错了。 不要使用定时器，不要链接它们。 看看jQuery Deferred / when，它拥有你需要的一切。
var imgara = []; for (image in imglist) { imgara[] = ajax call } $.when.apply($, imgara).done(function() { // do something }).fail(function() { // do something else });
尝试使用setInterval()函数而不是while() 。
var fetch = setInterval(loadImage, 2000); function loadImage(){ position= new position; //Change variable position here. getImageRequest(position); if(!GLOB_PROCEED_FETCH){ clearInterval(fetch); } }