加载更多帖子不起作用

时间:2013-10-23 07:37:34

标签: javascript jquery jquery-mobile

我正在添加一个LoadMore函数,根据当前显示的帖子长度和DOM中的总帖子追加更多帖子。我遇到的问题是当我控制登录listofposts并检查谷歌浏览器中的元素时,我看到长度显示为零(0)。我不确定我错在哪里或者我所采取的方法是正确的还是应该通过首先加载前4个帖子来分离这两个函数,然后创建一个单独的新函数来处理追加?

$(document).on('pagebeforeshow', '#blogposts', function() {     
    //$.mobile.showPageLoadingMsg();    
        $.ajax({
            url: "http://howtodeployit.com/category/daily-devotion/?json=recentstories&callback=",
            dataType: "json",
            jsonpCallback: 'successCallback',
            async: true,
            beforeSend: function() { $.mobile.showPageLoadingMsg(true); },
            complete: function() { $.mobile.hidePageLoadingMsg(); },
            success:function(data){

            var $listofposts = $('data');
            console.log($listofposts);
            var $loadMore = $listofposts.parent().find('.load-more');
           //   console.log($loadMore);

            currentPage = 0;
            postsPerPage = 4;

            var showMorePosts = function () {

                $offset = currentPage * postsPerPage, //initial value is 0

                    posts = data.posts.slice($offset, $offset + postsPerPage);
                    console.log(posts);
                    $.each(posts, function(i, val) {
                    //console.log(val);
                    $("#postlist").html();
                    var result = $('<li/>').append([$("<h3>", {html: val.title}),$("<p>", {html: val.excerpt})]).wrapInner('<a href="#devotionpost" onclick="showPost(' + val.id + ')"></a>');
                    $('#postlist').append(result);
                    console.log(result);
                    });

                    if(posts.length !== postsPerPage){
                        alert ('True');
                        $loadMore.hide();
                    }

                    currentPage++;
                    $("#postlist").listview();
                    $("#postlist").listview('refresh');
                    }

                    showMorePosts();
                    $loadMore.on('click', showMorePosts);

                }});

1 个答案:

答案 0 :(得分:1)

var $listofposts = $('data');

要求jQuery提供文档中所有<data>标记的列表。 您可能希望改为使用$(data)