等待AJAX​​调用返回 - 控制异步流

时间:2016-05-09 14:40:55

标签: javascript jquery ajax asynchronous

我一直在用这个问题破坏我的大脑并将其缩小为一个小样本代码以寻求帮助。我有多个数据库调用,但我需要按顺序进行调用。

问题似乎很简单,但解决方案使我望而却步。我所要做的就是在JS的执行计划中执行以下操作:

1-调用AJAX调用 2-等待它返回 3-顺着我的快乐方式

以下是我创建的示例代码:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AJAX Sample</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
// This variable has global scope
var sBuffer = '';   
var iDataFlag = 0;

function getData() { 

    iDataFlag = 1;
        console.debug('AJAX - Set Flag high');        

    $.ajax({
            type: "GET",                                                                    
            url: "http://wwdpipes.azurewebsites.net/wwdpipe.ashx",
            data: "url=http%3A%2F%2Fisbndb.com%2Fapi%2Fv2%2Fjson%2FIXA6S3IW%2Fbooks%3Fq%3D0596002068&type=xml",
            success: function(xml) {
                    // Parse the XML for a specific value   
                    var data = $(xml).find('title_latin').text();                                                
                    console.debug('AJAX - Reurned: ' + data);
                                        sBuffer = data;
                                        console.debug('AJAX - Set vairable');
                                        console.debug('AJAX - sBuffer: ' + sBuffer);
                                        iDataFlag = 0;                     
                                        console.debug('AJAX - Set Flag low');        
            },
                  async: true    //deprecated in v1.5+ 
    });

    return false;                                    
}


function waitForData() {                      
    if (iDataFlag == 1) 
                window.setTimeout(waitForData, 1000);
    else
                return;
}
</script>
<script type="text/javascript">

$(document).ready(function() {
       ///////////////////////
       getData();
       waitForData();   

       ///////////////////////
       console.debug('Main - iDataFlag=' + iDataFlag);
       console.debug("Main - sBuffer = " + sBuffer);       
});                                
</script>
</head>
<body>
</body>
</html>

并且打击是CONSOLE调试:

Untitled-3.html:15 AJAX - Set Flag high
Untitled-3.html:53 Main - iDataFlag=1
Untitled-3.html:54 Main - sBuffer = 
Untitled-3.html:24 AJAX - Reurned: Programming Web services with Perl
Untitled-3.html:26 AJAX - Set vairable
Untitled-3.html:27 AJAX - sBuffer: Programming Web services with Perl
Untitled-3.html:29 AJAX - Set Flag low

正如你所看到的,函数waitForData()没有做我认为它应该做的事情 - 我做了很多变化但是无法使它工作。

请帮助!

谢谢... Q

0 个答案:

没有答案