2013-02-27 3 views
0

Ajax 프로그램이 예상대로 실행되지 않습니다. 코드를 참조하십시오Ajax 프로그램이 예상대로 실행되지 않습니다.

$(document).ready(function(){ 
$("input").keyup(function() { 
    for(var i=400;i<421;i++){ 
     (function(counter){ 
      counter=String(counter); 
      $.ajax({ 
       type: "GET", 
       url: "results/result_html.php?usn="+txt+counter+"&resultType="+resultType, 
       dataType:"JSON", 
       success:function(result){ 
        $("#info").hide(); 
        $("#result").html(result);    
        $("#usn").attr("placeholder", "Class USN"); 
       } 
      }); 
     })(i); 
    } 
    alert("hai"); 
});}); 

이 코드에서는 for 루프에있는 모든 Ajax 요청을 완료 한 후 경고를 표시하려고합니다. 하지만이 코드를 실행하면 경고가 먼저 표시됩니다. 나는 아약스에게 새로운 사람이야. 내가 기대했던대로 도울 수있는 누군가가 나를 도와 준다.

+3

당신은 21 건의 아약스 요청을하고 있다는 것을 알고 있습니까? 그리고 아약스는 '비동기식'입니다. 즉, 결과를 기다리지 않고 함수 처리를 계속합니다. [jQuery $ .when()] (http://api.jquery.com/jQuery.when/)을보고 싶을 수도 있습니다. – sjdaws

답변

3

Ajax는 비동기 적으로 코드를 병렬로 계속 실행합니다. success 함수는 Ajax 요청이 완료된 후에 호출된다. 할 수있는 일은 다음과 같습니다.

$(document).ready(function(){ 
$("input").keyup(function() { 
    var loopsToDo = 20, done=0; 
    for(var i=400;i<421;i++){ 
      var counter=String(i); 
      $.ajax({ 
       type: "GET", 
       url: "results/result_html.php?usn="+txt+counter+"&resultType="+resultType, 
       dataType:"JSON", 
       success:function(result){ 
        $("#info").hide(); 
        $("#result").html(result);    
        $("#usn").attr("placeholder", "Class USN"); 
       }, 
       complete : function(){ 
        done++; 
        if(done == loopsToDo) 
        { 
         alert("DONE") 
        } 
       } 
      }); 
    } 

});}); 
0

AJAX 호출은 비동기식이므로 AJAX 호출을 설정 한 다음 스크립트를 계속 실행합니다. 'success'매개 변수는 응답이 수신되면 사용할 콜백을 지정합니다. 이는 언제든지 발생할 수 있습니다 (따라서 비동기식).

$(document).ready(function(){ 
    $("input").keyup(function() { 
     for(var i=400;i<421;i++){ 
      (function(counter){ 
       counter=String(counter); 
       $.ajax({ 
        type: "GET", 
        url: "results/result_html.php?usn="+txt+counter+"&resultType="+resultType, 
        dataType:"JSON", 
        success:function(result){ 
         $("#info").hide(); 
         $("#result").html(result);    
         $("#usn").attr("placeholder", "Class USN"); 
         alert("hai"); 
        } 
       }); 
      })(i); 
     } 
    }); 
}); 

이렇게하면 문제가 해결됩니다.

+0

"hai"20 번 경고합니다. – Husman

1

코드가 이상합니다. 아약스는 코드의 나머지 부분에 별도로 실행 의미, 비동기이기 때문에 왜,

for(var i=400;i<421;i++) 

는 또한, 경고는 Ajax 호출의 전에 먼저 표시됩니다 이동 않습니다. 20 개의 Ajax 요청을 실행 중이므로이 경고는 20 개가 모두 완료 될 때까지 기다리지 않습니다. 당신이해야 할 일은 성공한 부분에서 Ajax 호출 수를 유지하는 것입니다. 그리고 20이 같으면 경고를 표시합니다.

관련 문제