Question

我正在开展一个项目，我有一个评论，并想要显示前3，当你按下更多加载它应该再加载三个评论。我不擅长JQuery并且发现这个代码，似乎首先工作，但是它会立刻显示我的所有结果，并且负载更多并不能真正做到这一点。（除非有人能帮助我解决这个问题，否则我已经跳过了节目的部分内容）

HTML：

    <ul id="results">
        <li>...CONTENT1...</li>
        <li>...CONTENT2...</li>
        <li>...CONTENT3...</li>
    </ul>
<div id="loadMore">Load more</div>

JQuery的：

<script type='text/javascript'>
        $(window).load(function(){
        $(document).ready(function () {
            size_li = $("#results li").size();
            x=3;
            $('#results li:lt('+x+')').show();
            $('#loadMore').click(function () {
                x= (x+5 <= size_li) ? x+5 : size_li;
                $('#results li:lt('+x+')').show();
                 $('#showLess').show();
                if(x == size_li){
                    $('#loadMore').hide();
                }
            });
            $('#showLess').click(function () {
                x=(x-5<0) ? 3 : x-5;
                $('#results li').not(':lt('+x+')').hide();
                $('#loadMore').show();
                 $('#showLess').show();
                if(x == 3){
                    $('#showLess').hide();
                }
            });
        });
        });
    </script>

Answer 1

你最初需要隐藏它们，

#results li {display:none;}

在ul - JQuery中加载更多li

1 个答案: