简体   繁体   English

jQuery 加载更多按钮

[英]jQuery load more button

I have this great little bit of code that works really well with Wordpress.我有一小段很棒的代码,可以很好地与 Wordpress 配合使用。 It basically adds a load more button to a custom loop and when clicked adds the next lot of posts underneath.它基本上为自定义循环添加了一个加载更多按钮,并在单击时添加下面的下一批帖子。

The problem I have is with this line of code taken from the below snippett: error: function() { jQuery('button.load-more').attr('disabled', 'disabled').text('No More Posts') } // Disable the button and change its contents when there are no more posts我的问题是从下面的代码片段中获取的这行代码: error: function() { jQuery('button.load-more').attr('disabled', 'disabled').text('No More Posts') } // Disable the button and change its contents when there are no more posts

Basically when there are no more posts, the button doesn't get disabled as instructed.基本上当没有更多帖子时,按钮不会按照指示禁用。 Can somebody help me fix?有人可以帮我解决吗? Here's the JS in full:这是完整的JS:

var page = 1;

loadMore = function () {
    page++ //Increments the page number in the request
    $.ajax({
        url: './page/' + page,
        beforeSend: function () {
            $('#wait').show().parent().find('button.load-more').hide();
        },
        complete: function () {
            $('#wait').hide().parent().find('button.load-more').show();
        },
        success: function (data) {
            var $data = $(data).find('article');
            // Replace div#the-posts with the name of your post container
            jQuery('#posts .inner').append($data);
        },
        error: function () {
            jQuery('button.load-more').attr('disabled', 'disabled').text('No More Posts')
        } // Disable the button and change its contents when there arew no more posts

    }); // End Ajax
}; // End loadMore

jQuery('button.load-more').on('click', loadMore);

The error function is only called when the server returns some kind of error status code, which does not seem to happen.错误函数仅在服务器返回某种错误状态代码时调用,这似乎不会发生。

My guess is that you need to check the response.我的猜测是您需要检查响应。 The following could work:以下可能有效:

    success: function (data) {
        var $data = $(data).find('article');
        if ($data.length > 0) {  
          // Replace div#the-posts with the name of your post container
          jQuery('#posts .inner').append($data);
        }
        else {
          jQuery('button.load-more').attr('disabled', 'disabled').text('No More Posts');
        }
    },

But it's only a guess, since I don't know how the reponse looks like.但这只是一个猜测,因为我不知道响应的样子。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM