2011-09-29 4 views
0

jquery로 부분 포스트 백을 만드는 코드가 있습니다. 일부 작업을 수행 할 때 ajaxStart/ajaxStop을 사용합니다. 하지만 작동하지 않습니다. 나는 왜 그것이 작동하지 않는지 이해할 수 없었다. 여기 내 코드입니다jquery ajaxStart/ajaxStop 작동하지 않습니다.

$("#imgHolder").ajaxStart(function() { 
$('div#content').block({ 
      message: '<table><tr><td><img src="../images/ajax-loader.gif" border="0"/></td><td><h3>Processing...</h3></td></tr><table>', 
     css: { border: '1px solid #a00' } 
     }); 
    $('#imgHolder').empty(); 
    $("#btnPrint").hide(); 
    }); 

    $("#imgHolder").ajaxStop(function() { 
    $("#btnPrint").show(); 
    $('div#content').unblock(); 
}); 



$(document).ready(function() { 
$.ajax({ 
    type: "POST", 
    url: "UPSLabelFormUK.aspx/ProcessInfo", 
    data: JSON.stringify(DTO), 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (data) { 
    if (data.d[0].Message == "SUCCESS") { 
    //alert(data.d[0].TrackNumber); 
    ///alert(data.d[0].LabelImagePath); 
    var _images = [data.d[0].LabelImagePath]; 
    $.each(_images, function (e) { 
    $(new Image()).load(function() { 
    $('#imgHolder').html("<img src='" + data.d[0].LabelImagePath + "' width='310' height='402' border=0/>"); 
    }).attr('src', this); 
}); 
} 
} , 
    error: function (XMLHttpRequest, textStatus, errorThrown) { 
    alert(textStatus); 
    } 
}); 
}); 

내 위 ajaxstart/ajaxstop이 작동하지 않은 이유 난 그냥 이해하지 말아. 내 코드에서 왜 잘못되었는지 이해하도록 도와주세요.

하지만 난

 $(document).ajaxStart(function() { 
      $('div#content').block({ 
       message: '<table><tr><td><img src="../images/ajax-loader.gif" border="0"/></td><td><h3>Processing...</h3></td></tr><table>', 
       css: { border: '1px solid #a00' } 
      }); 

      $('#imgHolder').empty(); 
      $("#btnPrint").hide(); 
     }); 


     $(document).ajaxStop(function() { 
      $("#btnPrint").show(); 
      $('div#content').unblock(); 
     }); 

같은 비트가 유일한 변화가 $(document).ajaxStop(function() {

$("#imgHolder").ajaxStart(function() { 

의 instaed되는 코드를 변경할 때 내 ajaxstart/ajaxstop 그렇게 설명해주십시오 작업을 시작했다 왜 내 ajaxStart/ajaxStop 코드 위 작동하지 않았다. 감사

답변

6

그것은 당신이 AJAX 로더 지표로 그것을 를 사용하려면 쓸모가 있습니다, 진행중인 다른 아약스 요청이없는 경우 ajaxStart 만이라고는 사실을 감안할 때.

유 (말해이 작동되지 않거나)

jQuery(document).ajaxStart(function(){ 
alert("it begins"); 
}) 
+1

통해 UR 코드가 작동을하지만 ("#의 imgHolder를") $와 같은 코드를 사용하는 경우 ajaxStart (함수() {내가 사업부와 다음이 작동하지 않는 바인딩 의미. .plzz 이유를 설명하십시오. –

6

jQuery를 1.8로, .ajaxStop() 메서드는 문서에 첨부해야한다으로 노력했다.

"ajaxStop"의 jquery api 웹 페이지에서. 당신은 그것을 here으로 확인할 수 있습니다.

0

이 시도 :

$("#loading").bind({ 
    ajaxStart: function() { $(this).show(); }, 
    ajaxStop: function() { $(this).hide(); } 
}); 

는 기본적으로 ajaxStart와 ajaxStop 이벤트를 해고 세계적으로 loadingAnimationElement 바인딩. 당신이 그것을 의도 할 때 나타납니다.

jQuery가 Ajax 요청을 수행하지 않고 새 요청이 시작되면 ajaxStart 이벤트가 발생합니다. 첫 번째 요청이 끝나기 전에 다른 요청이 시작되면 이러한 새 요청으로 인해 새 ajaxStart 이벤트가 발생하지 않습니다. 마지막 대기중인 Ajax 요청이 완료되고 jQuery가 더 이상 네트워크 활동을 수행하지 않을 때 ajaxStop 이벤트가 트리거됩니다.

+0

이 답변은 정확하고 유용하지만 문제 해결에 도움이되는 방법을 설명하기 위해 설명과 함께 설명하는 것이 바람직합니다. 변경 사항이 있으면 나중에 특히 유용합니다 아마도 관련이없는) 작동을 멈추게하고 사용자는 이전에 어떻게 작동했는지 이해해야합니다. –

0

이 샘플 코드를 사용해보십시오 : -

var $loading = $('#div_Loader').hide(); 
    $(document).ajaxStart(function() { 

        $loading.show(); 
       }) 
      .ajaxStop(function() { 
       setTimeout(function() { 

        $loading.hide(); 
       }, 1000);     

    }); 
관련 문제