Question

我有一个脚本，它使用pagelinks编号显示下一页和上一页，如：

上一页1 2 3 4 5 6 7 8 9 10下一页

该网址更改为www.domain.com/?page=2。我想将其更改为附加新数据的（加载更多）按钮。到目前为止我得到了这个javascript：

        <script type="text/javascript">
$(document).ready(function() {


var new_btn = $('<div id="gig-more" class="gig-load-more" style="display: block;">   <button id="btn-white"  type="button" class="btn-standard-lrg btn-white"">Load More</button></div>');
  new_btn.insertAfter('#frame{$currentpage+1}');

  $('#btn-white').click(function() {


$.get('?page={$thenextpage}  ', function(html){ 
  $(html).find("#testframe").appendTo("div#testframe");
});
});
});
 </script>

{$ currentpage}和{$ thenextpage}是使用的智能变量

单击第（1）页中的按钮可正确加载页面（2）。但是，如果再次单击该按钮，则会一次又一次地加载第二页。

我怎样才能做到这一点？

Answer 1

我认为你太复杂了。你真的不需要聪明才智。这就是整个事情：

<script type="text/javascript">
// Store what page to load next
nextpage = 2;

$('#load_more').click(function(event) {
  // Retains compatibility for those with no javascript
  event.preventDefault();

  // Fetch the data
  $.get('/ajax.php?page=' + nextpage, function(html){

    // Put the data where it belongs. I like it more this way
    $("div#testframe").append(html);

    // Keep the counter up-to-date
    nextpage++;
    });

  });
</script>

但是，您需要进行更多更改。你需要输入你的html这个按钮：

<a href = "?page=2" id = "load_more">Load more</a>

请注意，这使得它向后兼容那些没有javascript的人，比如网络抓取工具，同时它增强了体验，以满足拥有它的人的要求。

创建一个类似于当前index.php的 ajax.php ，但它只加载所需的数据，因为你不想让用户必须加载一堆永远不会被使用的东西。

使用“加载更多”按钮加载页面

1 个答案: