모든 ajax 호출이 완료되면 화면로드 중입니다.

Question

안녕하세요, ajax 호출에 문제가 있습니다. 나는 기본적으로 10 개의 아약스 요청이 만들어진 동안 표시하고 숨기는 div 인로드 중 화면을 표시하려고합니다. 그것은 파이어 폭스 3.6에서 잘 작동하는 것으로 보이지만 div는 크롬 10과 IE8에 나타나지 않습니다. 문제는 div가 나타나고 있지만 Ajax 호출 전에 열리는 숨겨진 이벤트가 발생하기까지 수 밀리 초 동안 만 표시된다는 것입니다. 여기 기능입니다 :

function addAllToPlaylist() { 
    var title; 
    var i = 1; 
    var percentage = 0; 
    var total = $('.tdtrackname').size(); 
    $('#loadingscreen').show(); 
    $('.tdtrackname').each(function() { 
     $.ajax({ 
     async: false, 
     url: 'ajax/addsongtoplaylist.php?query=' + $(this).html(), 
     success: function(data) { 
      $('#divajax').html(data); 
      percentage = Math.round((i/total) * 100); 
      $('#loadingmsg').html('<h3>Adding songs...please wait<br>' + i + '/' + total + ' (' + percentage + '%)</h3>'); 
     } 
     }); 
     i++; 
    }); 
    $('#loadingscreen').hide(); 
} 

내가 로딩 화면이 늦게 .. 미리

Answer 1

에서 덕분에 당신은 비동기 요청하고 있습니다 오픈됩니다 아무 생각이 왜, 당신이 좀 도와 수 있기를 바랍니다가, 로딩 화면을 동 기적으로 처리합니다. success 함수에서이 div를 제거해야하며, 아직 열려있는 요청 수를 세는 방법이 필요할 것이다.

Answer 2

원한다면 이렇게 할 수 있습니다.

function addAllToPlaylist() { 
    var title; 
    var i = 1; 
    var percentage = 0; 
    var total = $('.tdtrackname').size(); 
    $('#loadingscreen').show(); 

    percentage = Math.round((i/total) * 100); 
      $('#loadingmsg').html('<h3>Adding songs...please wait<br>' + i + '/' + total + ' (' + percentage + '%)</h3>'); 

    $('.tdtrackname').each(function() { 
     $.ajax({ 
     async: false, 
     url: 'ajax/addsongtoplaylist.php?query=' + $(this).html(), 
     success: function(data) { 
      $('#divajax').html(data); 
      $('#loadingscreen').hide(); 
     } 
     }); 
     i++; 
    }); 

} 

Answer 3

당신은 항상 모두를 체인, 아약스 호출 후 함수를 사용하고, 아약스 호출이 모두 완료되면 다음, 사업부를 닫을 수 있습니다. 이것은 항상 지정된 함수 내부의 카운터를 사용하여 수행 할 수 있습니다.

예 :

var methodCounter = 0; 

$.ajax({ 
    success: function(d) { 
    }, 
    url: 'xxx', //Where xxx is the url being hit 
}).always(function() { 
    methodCounter++; 
    if (methodCounter == limit) { //limit is the number of times to do the ajax call before closing the dialog box 
    //Hide the dialog box here 
    } 
});