jQuery和AJAX--添加了Ajax的对象动态不能用于jQuery功能？

Question

所以我有一个生成这样

<div class="photoset"> 
    <img /> 
    <img /> 
</div> 

<div class="photoset"> 
    <img /> 
    <img /> 
    <img /> 
</div> 

东西MVC编码和我试图做一个jQuery的无限滚动和用户滚动，它会产生更多的photosets。

我在这方面做得有些成功，但是在用无限滚动生成更多的照片后，新添加的代码无法与之前的jQuery插件一起在图像之间导航。

这里是jQuery代码导航：

jQuery的

$(document).ready(function() { 
    $('.photoset').each(function() { 
     $(this).data('counter', 0); 
     $items = $(this).find('img') 
     $(this).data('numItems', $items.length); 
     $(this).closest('.row').prev('.row').find('.nav-informer').text($(this).data('counter') + 1 + " de " + $(this).data('numItems')); 

     if (($items.eq(0).width()/$items.eq(0).height()) < 1) { 
      $(this).css({ 
       width: "445", 
       height: "667", 
       margin: "auto" 
      }); 
     } 
    }); 

    var showCurrent = function (photoset) { 
     $items = photoset.find('img'); 
     var counter = photoset.data('counter'); 
     var numItems = $items.length; 
     var itemToShow = Math.abs(counter % numItems); 
     $items.fadeOut(1000); 
     $items.eq(itemToShow).fadeIn(1000); 
    }; 

    /* ---------------------------------------------- /* 
    * Prev 
    /* ---------------------------------------------- */ 
    $('.prev').on('click', function() { 
     var photoset = $(this).closest('.row').prev('.row').find('.photoset'); 
     photoset.data('counter', photoset.data('counter') - 1); 
     if (photoset.data('counter') < 0) 
      photoset.data('counter', photoset.data('numItems') - 1); 
     photoset.closest('.row').prev('.row').find('.nav-informer').text(photoset.data('counter') + 1 + " de " + photoset.data('numItems')); 
     showCurrent(photoset); 
    }); 

    /* ---------------------------------------------- /* 
    * Next 
    /* ---------------------------------------------- */ 
    $('.next').on('click', function() { 
     var photoset = $(this).closest('.row').prev('.row').find('.photoset'); 
     photoset.data('counter', photoset.data('counter') + 1); 
     if (photoset.data('counter') > photoset.data('numItems') - 1) 
      photoset.data('counter', 0); 
     photoset.closest('.row').prev('.row').find('.nav-informer').text(photoset.data('counter') + 1 + " de " + photoset.data('numItems')); 
     showCurrent(photoset); 
    }); 
}); 

而阿贾克斯函数来调用更多的photosets，传递页码：

阿贾克斯

var page = 0, 
inCallback = false, 
hasReachedEndOfInfiniteScroll = false; 

var ulScrollHandler = function() { 
    if (hasReachedEndOfInfiniteScroll == false && 
     ($(window).scrollTop() == $(document).height() - $(window).height())) { 
     loadMoreToInfiniteScrollUl(moreRowsUrl); 
     resizeNewElements(); 
    } 
} 

function loadMoreToInfiniteScrollUl(loadMoreRowsUrl) { 
    if (page > -1 && !inCallback) { 
     inCallback = true; 
     page++; 
     $(".loading").show(); 
     $.ajax({ 
      type: 'GET', 
      url: loadMoreRowsUrl, 
      data: "pageNum=" + page, 
      success: function (data, textstatus) { 
       if (data != '') { 
        $(".infinite-scroll").append(data); 
       } 
       else { 
        page = -1; 
       } 

       inCallback = false; 
       $(".loading").hide(); 
      }, 
      error: function (XMLHttpRequest, textStatus, errorThrown) { 
      } 
     }); 
    } 
} 

function showNoMoreRecords() { 
    hasReachedEndOfInfiniteScroll = true; 
} 

这是调用无限滚动功能：我做了一些研究，但不能stabilish一个原因，我的代码不能正常工作

$(function() { 
     $(".loading").hide(); 
    }); 
    var moreRowsUrl = '@Url.Action("index", "home")'; 
    $(window).scroll(ulScrollHandler); 

，尝试了一些东西，但没有成功。如果有人能帮助我，那会很棒！在此先感谢，对于任何错误感到抱歉，我对jQuery和Ajax非常感兴趣。

Answer 1

您可以对.prev和.next元素的单击事件事件代表团尝试：

$(document).ready(function(){ 
    $(document).on('click', '.prev', function(){.....}); 
    $(document).on('click', '.next', function(){.....}); 
});