0

here's what I have:

$(document).ready(function(){
    //stuff
}).ajaxSend(function() {
    $('.overlay').show();
}).ajaxStop(function() {
    $('.overlay').fadeOut();
});

The problem I am having is that the first time I trigger an ajax action it works perfectly, but not any time after that. I have to reload the page for the ajaxSend/Stop to work again. So say I load a page, click 'load more' to ajax load content, the overlay shows up no problem. but then I click it a second time, everything works fine except the modal doesn't show up this time or any time after.

any ideas?

4

1 に答える 1

3

$(document).ready一度だけ呼び出されます - DOM がロードされたとき。これは、ajax 経由でデータをロードする場合には機能しません。

2 つのオプション:

まず、ajaxページのロードの一部としてロードしているIDを使用してdivを識別できる場合は、次のことができます(編集):

$('.overlay').ajaxSend(function() { 
                                       $(this).show(); });
$('.overlay').ajaxStop(function() { 
                                       $(this).fadeOut(); });

または、完全に無視ajaxStartしajaxStopて、「もっと読み込む」リンクをクリックしたときにそれらをトリガーすることもできます。たとえば、次のようになります。

$("a").click(function(){
   var url = $(this).attr('href');
   $(".overlay").show("fast", function(){
       $("#targetdiv").load(url + " #div_id", {}, function(){
          $(".overlay").fadeOut();
       })
   })
   return false;
});
于 2012-11-02T21:57:06.443 に答える