, 일부 내용의 하중이 코드는 다음과 같습니다 그래서 나는 JQuery와 아약스 API를 사용하고

Question

로딩 그래픽 jQuery를 추가

$.ajax({ 
    type:"POST", 
    url:"/search/location", 
    data: getQuery, 
    success:function(data){ 
     //alert(getQuery); 
     //console.log(data); 
     $('body.secEmp').html(data); //overwrite current data 
     setUpRegionCheckBoxes(); //fire function again to reload DOM 
    } 

}); 내 아약스 내가 숨겨진 사업부를 표시 할 내용에 가지고있는 동안 내 HTML에서

나는 이것이 <div id="loading">Loading Content</div>이는 display:none의 그것에 CSS 스타일을 가지고,하지만 난 멀리 너무 .ajaxStart를 연결 시도을 찾을 수 없습니다 내로드 div에서 다음 show() 일을하지만 그 작동하지 않았다.

어떤 조언이 필요합니까? 이 같은

Answer 1

$("#loading").show(); // show the div before the ajax call 

$.ajax({ 
    type:"POST", 
    url:"/search/location", 
    data: getQuery, 
    success:function(data){ 
     //alert(getQuery); 
     //console.log(data); 
     $('body.secEmp').html(data); //overwrite current data 
     setUpRegionCheckBoxes(); //fire function again to reload DOM 

     $("#loading").hide(); //hide the loading div in callback function 
    }, 
    error: function(){ 
     // error callback routine 
     $("#loading").hide(); //hide the loading div in callback function 
    } 
});  

Answer 2

어떻게 좀 :

$("#loading").show(); 
$.ajax({ 
    type:"POST", 
    url:"/search/location", 
    data: getQuery, 
    success:function(data){ 
     //alert(getQuery); 
     //console.log(data); 
     $('body.secEmp').html(data); //overwrite current data 
     setUpRegionCheckBoxes(); //fire function again to reload DOM 
     $("#loading").hide(); 
    } 
}); 

는 또한 오류의 경우 사업부를 숨길 수 있습니다. fadeIn 및 fadeOut을 실험 해 볼 수 있습니다.

Answer 3

$("#loading").show(); 
$.ajax({ 
    type:"POST", 
    url:"/search/location", 
    data: getQuery, 
    success:function(data){ 
     //alert(getQuery); 
     //console.log(data); 
     $('body.secEmp').html(data); //overwrite current data 
     setUpRegionCheckBoxes(); //fire function again to reload DOM 
     $("#loading").fadeOut(); 
    } 
}); 

당신은 당신이 스크립트 asswell있어에서 AJAX는 당신이있어 신경 끄시 아

// EDIT

을 triggerd되지 않을 때 로딩 사업부를 표시하지 않는 $("#loading").hide();을 넣어했습니다 당신의 스타일 display: none;