将更多数据附加到现有数据中

Question

我希望不要问这个问题，因为我决定阅读更多内容并进行更多研究，但目前我还没有走得太远。

这是我的代码：

function listPosts(data) {
    var $count = data.count;
    var limitposts = 5;
    var $output = $('<ul class="posts" data-role="listview" data-filter="true">')
    $.each(data.posts,function(i, val) {
        console.log(i);
        if (i<limitposts && i>=0) {
    var $post = $('<li/>').append([$("<h3>", {html: val.title}),$("<p>", {html: val.excerpt})]).wrapInner('<a href="#devotionpost" onclick="showPost(' + val.id + ')"></a>');
    $output.append($post).appendTo('#postlist');
        i++;
   // return (i !== 4);
}});

}

HTML

<!-- Page: home -->
    <div id="home" data-role="page" data-theme="d" data-title="My first App">
        <div data-role="listview">
            <a href="#devotion" id="devotionclick" data-role="button">Display Messages</a>
        </div><!-- links -->
    </div><!-- page -->

    <div id="devotion" data-role="page" data-title="My first App">
        <div data-role="header" data-theme="a" data-position="fixed"> <h2>Devotional Messages</h2></div><!-- header -->
        <div data-theme="d" data-role="listview" id="postlist"> </div><!-- content -->
        <div class="addMorePosts">Load More Posts...</div> 
    </div><!-- page -->

<script src="http://howtodeployit.com/category/daily-devotion/?json=recentstories&callback=listPosts" type="text/javascript"></script>

我最初使用 Return 语句来限制显示的帖子数量。我现在将其更改为 For 语句，看看是否可以通过单击按钮来增加显示的帖子数。

在这个阶段，我正在尝试找出最适合使用的逻辑。我试图添加另一个函数来实现这一点，但没有运气。仍在阅读和研究，但希望得到指导或好的例子

Answer 1

function addMorePosts ( data, offset, amount ) {

    var $postsList = $('#postlist'),
        posts = data.slice(offset, amount);

    $.each(posts, function ( index, post ) {

        $postsList.append(
            '<li>' +
                '<h3>' + post.title + '</h3>' +
                '<p>' + 
                    post.excerpt + 
                    '<a href="#devotionpost" onclick="showPost(' + post.id + ')"></a>' +
                '</p>' +
            '</li>'
        );

    });

}

JSFiddle：http://jsfiddle.net/V4Ucv/2/