Question

我正在构建一个显示不同位置的应用程序。

我想点击显示更多按钮一次显示10个地方。目前，我可以首先显示10个项目，但第二次点击所有项目都会显示，而i want consecutive 10 items each time i click显示更多按钮。

<?php
    echo 
    "<script>
     $('ul')
     .find('li:gt(10)')
     .hide()
     .end()
     .append(
     $('<li><a>Show More</a></li>').click(function(){
     $(this).siblings(':hidden').show().end().remove()
     }));
    </script>";
    ?>

Answer 1

您通常有两种选择。你的一部分HTML也可能有用。

1）仅搜索十个隐藏元素，您现在总是搜索10个元素（因此它们总是相同）。如果隐藏元素是你可以做的：

<?php
echo 
"<script>
 $('ul')
 .find('li:hidden:gt(10)')
 .hide()
 .end()
 .append(
 $('<li><a>Show More</a></li>').click(function(){
 $(this).siblings(':hidden').show().end().remove()
 }));
</script>";
?>

2）存储显示项目的实际数量，并在每次点击按钮显示更多项目时添加10项。

<?php
echo 
"<script>
 var itemsDisplayed = 10;
 $('ul')
 .find('li:gt(itemsDisplayed)')
 .hide()
 .end()
 .append(
 $('<li><a>Show More</a></li>').click(function(){
 itemsDisplayed = itemsDisplayed + 10;
 $(this).siblings(':hidden').show().end().remove()
 }));
</script>";
?>

显示更多项目

1 个答案: