Jquery loader работает только для первого запроса

Question

Я действительно пытаюсь использовать «эргономичное касание» для своего приложения, поэтому у меня есть 3 ссылки, которые получают содержимое html и загружают его в div. Все работает отлично, за исключением загрузчика, который появляется только во время первого запроса.

Вот мой код

$(document).ready(function() { 

$('#loader') 
.hide() // hide it initially 
.ajaxStart(function() { 
    $(this).show(); 
}) 
.ajaxStop(function() { 
    $(this).hide(); 
}); 

var uri_segment = "<?=$this->uri->segment(3);?>"; 


$('#editTeam').click(function (e) { 

    e.preventDefault(); 
    $(this).parent().siblings().removeClass('active'); 

    $(this).parent('li').addClass('active'); 



    $.ajax({ 
     type : "GET", 
     async : true, 
     url : "<?=base_url().'ajax/team/get_editTeam/';?>"+uri_segment, 
     dataType : "html", 
     success : function(data){ 
       $('#divPage').html(data); 

     } 
    }); 

    return false; 
}); 

$('#editRights').click(function (e){ 
    e.preventDefault(); 

    $(this).parent().siblings().removeClass('active'); 


    $(this).parent('li').addClass('active'); 

    $.ajax({ 
     type : "GET", 
     async : false, 
     url : "<?=base_url().'ajax/team/get_editRights/';?>"+uri_segment, 
     dataType : "html", 
     success : function(data){ 
       $('#divPage').html(data); 
     } 
    }); 
    return false; 
}); 


$('#addMember').click(function (e){ 

    e.preventDefault(); 

    $(this).parent().siblings().removeClass('active'); 


    $(this).parent('li').addClass('active'); 



     $.ajax({ 
      type : "GET", 
      async : false, 
      url : "<?=base_url().'ajax/team/get_addMember/'.$this->uri->segment(3);?>", 
      dataType : "html", 
      success : function(data){ 
       $('#divPage').html(data); 

      } 
     }); 
     return false; 
}); 


}); 

Answer 1

Попробуйте переместить ваш ajaxStart/ajaxStop на документ. Per the documentation, as of 1.8 you should only bind it to document.

$('#loader').hide(); 

$('document') 
    .ajaxStart(function() { 
    $('#loader').show(); 
    }) 
    .ajaxStop(function() { 
    $('#loader').hide(); 
    });