ADT*_*ADT 7 javascript ajax jquery
我正在尝试循环使用具有相同命名约定和结构的3个不同json文件的ajax调用(但数据略有不同).自从我在论坛中阅读Alnitak的回复(jQuery ajax成功回调函数定义)以来,我一直在使用延迟对象而不是成功选项,这样我的ajax处理和回调处理就可以解耦了.以下是我的代码:
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=ISO-8859-1" />
<title>Stuff</title>
<script src="jquery-1.9.1.min.js" type="text/javascript"></script>
</head>
<body>
<script Language="JavaScript">
var myData = [];
var myURL = ["ticker1.json","ticker2.json","ticker3.json"]; //New Array for my URLs
function getData(m) {
return $.ajax({
url : myURL[m], //<<<---Want to loop through this array
type : 'GET',
dataType: 'json'
});
}
function handleData(data){
for (var i=0; i<data.test.msgOne.length; i++){
myData[i] = data.test.msgOne[i];
}
};
for (var j=0; j<3; j++){
console.log(j); //<<---First console statement
var ajaxCall = getData(j).done(handleData);
$.when(ajaxCall).done(function(){ //wait until the ajax call is done before writing
console.log(j); //<<---Second console statement
for (var k=0; k<3; k++){
document.write(myData[k])
document.write('<br><br>');
}
});
}
</script>
</body>
</html>
我的代码包含一个名为getData的函数,它执行ajax调用,然后是一个名为handleData的函数,它只是从ajax调用中循环遍历json文件中的数据,并将数据存储在数组myData中.然后for循环尝试将数组myData的数据输出到屏幕.但是,问题是我只是从屏幕上的第一个json文件输出获取数据,而不是所有三个顺序.
所以我所做的是在for循环中输入两个console.log语句:一个在ajax调用之前,一个在ajax调用完成之后.第一个console.log按预期顺序输出0,1,2,第二个给出3,这是意外的.所以我假设在计数器完成之前ajax调用没有返回.我用一些逻辑语句和一个while循环替换了for循环(是的,我知道无限期运行代码的危险),如下所示:
var j=0;
var whileFlag= new Boolean(1);
var ajaxFlag = new Boolean(1);
while (whileFlag) {
if (ajaxFlag > 0) {
ajaxFlag = 0;
console.log(j);
var ajaxCall = getData(j).done(handleData);
}
$.when(ajaxCall).done(function(){
console.log(j);
for (var k=0; k<3; k++){
document.write(myData[k])
document.write('<br><br>');
}
ajaxFlag = 1;
j++;
});
if (j>=3) {whileFlag = 0};
}
替换代码试图在进入下一个ajax调用之前强制执行ajax调用然后执行代码.好吧,最终的结果是一个冻结的浏览器,这是没有bueno.有谁知道我怎样才能将每个json文件的myData数组写入屏幕？任何帮助和建设性意见表示赞赏.此外,我需要保持ajax调用异步,因为我将来会使用jsonp数据类型.
附加问题:我认为浏览器挂机是由于ajax没有返回电话,但问题是为什么？如果我选择不在第一个示例中实现for循环,而只是将j变量显式设置为0,或1或2,则数据打印出来对于所选的json文件很好,但是如果我做的多于它只会打印第一个json文件中的数据集.这就像是不可能做多个ajax调用或其他东西.任何见解和帮助表示赞赏.谢谢.
问题是你的 while 循环相当于......
while (whileFlag) {
if (ajaxFlag > 0) {
ajaxFlag = 0;
console.log(j);
var ajaxCall = getData(j).done(handleData);
}
// Some thrid party (asynch Handler) changes j
if (j>=3) {whileFlag = 0};
}
理想情况下，直到 Ajax 完成你的代码运行为
while (whileFlag) {
if (j>=3) {whileFlag = 0};
}
这会挂起您的浏览器...
如果你真的想等待第二个 Ajax 调用直到第一个完成等等..
function getData(m) {
return $.ajax({
url : myURL[m], //<<<---Want to loop through this array
type : 'GET',
dataType: 'json',
myJ: m
});
}
function handleData(data){
for (var i=0; i<data.test.msgOne.length; i++){
myData[i] = data.test.msgOne[i];
}
for (var k=0; k<3; k++){
document.write(myData[k])
document.write('<br><br>');
}
if(this.myJ<2){
var myJ=this.myJ;
setTimeout(function(){
getData((myJ+1)).done(handleData).fail(failed);
}, 100);
}
};
getData(0).done(handleData);
function failed(jqXHR, textStatus, errorThrown){
alert("textStatus="+textStatus);
alert("Error= "+errorThrown);
}
根据带有警报的评论，如果其工作正常，则使用 settimeout ..并且它将工作