infinite-scroll append出來的頁面ajax失效?

新手上路,请多包涵

各位好,小妹最近使用infinite-scroll插件遇到一點問題,當scroll到第二頁的時候,append的頁面中ajax會失效,參照了官方文件沒找到什麼可用資源,這邊想來請教一下各位前輩們的意見。

頁面結構如下:append出來的頁面會用<article>包住,page2有一組ul的li是用ajax產出。

<div class="article-feed" data-infinite-scroll="{ &quot;path&quot;: &quot;.pagination__next&quot;, &quot;append&quot;: &quot;.article&quot;, &quot;status&quot;: &quot;.scroller-status&quot;, &quot;hideNav&quot;: &quot;.pagination&quot; }">
            
            <article class="article">
                //page1內容
            </article>
            
            <article class="article">
                //page2內容(append內容)
                <ul class="latesNews"></ul>
            </article>
</div>

ajax的代碼如下:就是從json撈一些資料印出來,在其他頁面都能順利印出,唯獨在infinite-scroll append出來的頁面沒辦法作用,console也沒跳錯誤。

$.ajax({
            url: "http://xxxxx/api/aall.json",
            dataType:'json',
            type: 'GET',
            data: "data",
            cache: false,
            ifModified: true,
            success: function getData(data){
                // console.log(data.ClassItem.NewsItems);
                var str = '';
                var List = $('.latesNews');
                for(var i=0; i<10;i++){
                // var kindName = data.NewsItems[i].kindName;
                    var title = data.ClassItem.NewsItems[i].HeadLine;
                    var url = data.NewsItems[i].url;
                    var time = data.ClassItem.NewsItems[i].UpdateTime.substring(10);
                    if(title.length>25){
                        title = title.substring(0,25)+'...';
                    }
                    str += '<li><a href="'
                        + url +'" target="_blank"><div><span class="time">'
                        + time +'</span></div><div class="title">'
                        + title +'</div></a></li>'
                }
                List.html(str);
            },
            error: function(result){ console.log('error'); }
    
   }); 

infinite-scroll的代碼:infinite-scroll也是可以正常作用,並將一些function包進append.infiniteScroll中(官方建議作法)但是小妹將ajax的代碼整串包進去,還是無法作用。

$('.article-feed').infiniteScroll({
  // options
  path: '.pagination__next',
  append: '.post',
  history: false,
});
$('.article-feed').on('append.infiniteScroll',function(){
    videoResize();
    youtubeFun();
    SideBoxFun();

});

還請各位前輩們指點迷津,謝謝!

阅读 1.5k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏