無限滾動jQuery插件不起作用

Question

我正在嘗試使用無限滾動jquery插件將無限滾動添加到codeigniter的分頁中。 但是沒有成功

這是我的控制器：

$config['base_url'] = site_url('news/home/');
$config['total_rows'] = $this->home_model->count_new();
$config['per_page'] = 3;
$config['uri_segment'] = 3;
$config['limit'] = $config['per_page'];
$this->pagination->initialize($config);
$data['news'] = $this->home_model->list_data_new($config['per_page'], $this->uri->segment($config['uri_segment']));
$this->load->view('news_view',$data);

這是我的看法：

<div id="content">
<?php foreach ($news as $data):?>
    <?php echo $data['title']?>
    Post by: <?php echo $data['username']?>
<?php endforeach;?>
</div>
<button id="next">load more</button>

而且這也是javascript中的視圖：

 $('#content').infinitescroll({
     navSelector  : "#next:last",            
     // selector for the paged navigation (it will be hidden)
     nextSelector : "#next:last",    
     // selector for the NEXT link (to page 2)
     itemSelector : "#content"          
     // selector for all items you'll retrieve
});

分頁鏈接看起來像這樣http://localhost/latihan/news/home/3然后單擊“下一步”就像這樣http://localhost/latihan/news/home/6

問題是下一個帖子不顯示，並且“加載更多”按鈕未加載數據。

有答案嗎？

非常感謝...

Answer 1

您的設置錯誤。

我建議您看一下http://www.infinite-scroll.com本身頁面的源代碼，因為它們使用的是自己的插件。 在頁面上向下滾動以查看其工作情況。

除此之外，我不得不說他們的產品記錄極差，並且以非常不直觀的方式工作。 例如，它將從nextSelector讀取下一頁的URL，但僅當該元素是超鏈接<a ...>且僅在第一次時。 然后，它將解析該URL中是否出現數字“ 2”，然后加載該數字並將其替換為3，依此類推。 因此，您打算將第2頁設為home / 3，第3頁設為home / 6的設計不適用於此插件。

幫個忙，改用jScroll 。