JavaScript를 사용하여 페이지가 완전히로드 된 후 코드 실행

Question

다음 코드가 작동하는 데 몇 시간 동안 노력했습니다. 페이지가로드 될 때까지 코드가 일시 중지되어야합니다. 내가 만나는 문제는 AJAX가 비동기 적으로 실행된다는 것입니다. 실행하기 전에 코드를 강제로 대기 시키려면 어떻게해야합니까?

var i = 1; 
function On_Success(){ 

    i = i+1; 
    if(i<=10){ 

    $('<div id="p'+i+'">b</div>').replaceAll('#b'); 
    $('#p'+i).load('tabelle.html'); 
    //here shoul be waited, til the page is loaded 
    On_Success(); 
    }; 
    }; 

    function knopf(){ 
    $('body').append('<div id="p'+i+'">a</div>'); 
    $('#p'+i).load('tabelle.html'); 
    On_Success(); 
    }; 

Answer 1

.load로드가 완료 될 때 실행되는 콜백을 허용합니다. 좀 더 자세한 정보 인 jQuery.ajax 함수 대신이 코드를 사용할 수 있습니다.이 코드는 요소를 채우기 위해 추가 코드를 작성해야합니다.

jQuery("#p", i).load("tabelle.html", function() { 
    //code to run when tabelle.html has finished loading 
}); 

코드를 다음과 같이 변경하십시오. 작동해야합니다 :

var i = 1; 

function On_Success() { 

    i = i + 1; 
    if (i <= 10) { 
     $('<div id="p' + i + '">b</div>').replaceAll('#b'); 
     $('#p' + i).load('tabelle.html', On_Success);   
    }; 
}; 

function knopf() { 
    $('body').append('<div id="p' + i + '">a</div>'); 
    $('#p' + i).load('tabelle.html', On_Success); 
}; 

또 다른 점은 다른 div를 채우기 전에 하나의로드가 완료 될 때까지 기다려야한다는 사실입니까? 왜 같은 것을 할 수 없습니다

function On_Success() { 
    var i = 0; 
    while(i < 11) { 
     $('<div id="p' + i + '">b</div>').replaceAll('#b'); 
     $('#p' + i).load('tabelle.html');   
    }; 
}; 

을 또한, 나는 knopf 기능이 무엇을하고 있는지 모르겠어요. 해당 기능에 i의 가치는 무엇이되어야합니까? 어떻게 코드를 부르니?

Answer 2

응답이 완전히 반환 될 때 실행할 수있는 함수는 Ajax와 load 모두에 successs 함수가 있습니다. 성공 핸들러 만이라고

$('#p'+i).load('tabelle.html', function() { 
    On_Success(); 
}); 

:

$("#myDiv").load('/ajax/data/get', function() { 
    //do stuff here 
}); 

Answer 3

로드 함수는 성공 핸들러가 :

$.ajax({ 
     async: true, 
     type: "GET", 
     url: url, 
     data: params, 
     success: function(html){ 
       //do stuff here 
       }, 
     error: handleAjaxErrors 

    }); 

당신이 부하를 사용하려는 경우뿐만 아니라 성공 콜백이있다 ajax 호출이 성공적으로 완료된 후 제공된 컨텐츠가 DOM에 추가 된 후. 당신은 또한 당신이 크리스의 대답 @ 따라 전체 $.ajax 전화를 사용해야합니다 클라이언트에 오류 상태를 캡처 할 경우

http://api.jquery.com/load/

:

현재 전체 문서를 볼 수 있습니다.