【问题标题】:Wordpress jQuery How to reset pagination when a post is toggled?Wordpress jQuery如何在帖子切换时重置分页?
【发布时间】:2011-11-17 01:34:58
【问题描述】:

当然,一定有人知道如何让它发挥作用......

我的博客当前设置为我有一个自定义页面,该页面仅显示给定类别中的帖子。每个帖子都有一个切换按钮。当按下切换按钮时,帖子隐藏(整个 div 隐藏,标题和所有帖子内容)。这可以按需要工作。

该页面还设置为每页显示 10 个帖子。如果我有 11 个帖子,则第 11 个帖子会被推送到第 2 页。这可以正常工作。

问题是,当一个帖子被切换时(比如说帖子 3),我在这个页面上总共剩下 9 个帖子,第 2 页上还剩下 11 个帖子。我想要发生的是,当发布3 被切换,帖子 11 应该继续到第 1 页,第 2 页基本上消失了(因为那里没有要显示的帖子)。

出于说明目的: 第 1 页显示帖子 1,2,3,4,5,6,7,8,9,10 第 2 页显示帖子 11...等等。

如果 Post 3 被切换: 第 1 页显示帖子 1,2,4,5,6,7,8,9,10,11 第 2 页消失(除非有帖子 12,13 等)

有人知道如何实现吗?

page.php:

<?php
    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
    $args = array(
        'category_name' => 'post',
        'paged' => $paged,
        'posts_per_page' => 10
    );
    query_posts($args);
    while (have_posts()) : the_post();
?>

..........the posts are displayed.............

    <?php endwhile; ?>

<script type="text/javascript">
var pager = new Imtech.Pager();
$(document).ready(function() {
pager.paragraphsPerPage = 5; // set amount elements per page
pager.pagingContainer = $('#paginate'); // set of main container
pager.paragraphs = $('div.z', pager.pagingContainer); // set of required containers
pager.showPage(1);
});
</script>

toggle.js

    $(document).on("click", ".toggle", function(){
    postID = $(this).attr('id').replace('toggle_', '');

    // Declare variables
    value = '0';

    myajax();

    return false;
});

function myajax(){
    // Send values to database
    $.ajax({
        url: 'check.php',
        //check.php receives the values sent to it and stores them in the database
        type: 'POST',
        data: 'postID=' + postID + '&value=' + value,
        success: function(result) {
             $('#post_' + postID).toggle();
                    }
    });
}

分页.js

var Imtech = {};
Imtech.Pager = function() {
this.paragraphsPerPage = 3;
this.currentPage = 1;
this.pagingControlsContainer = '#pagingControls';
this.pagingContainerPath = '#contained';
this.numPages = function() {
    var numPages = 0;
    if (this.paragraphs != null && this.paragraphsPerPage != null) {
        numPages = Math.ceil(this.paragraphs.length / this.paragraphsPerPage);
    }
    return numPages;
};
this.showPage = function(page) {
    this.currentPage = page;
    var html = '';
    this.paragraphs.slice((page-1) * this.paragraphsPerPage,
        ((page-1)*this.paragraphsPerPage) + this.paragraphsPerPage).each(function() {
        html += '<div>' + $(this).html() + '</div>';
    });
    $(this.pagingContainerPath).html(html);
    renderControls(this.pagingControlsContainer, this.currentPage, this.numPages());
}
var renderControls = function(container, currentPage, numPages) {
    var pagingControls = 'Page: <ul>';
    for (var i = 1; i <= numPages; i++) {
        if (i != currentPage) {
            pagingControls += '<li><a href="#" onclick="pager.showPage(' + i + '); return false;">' + i + '</a></li>';
        } else {
            pagingControls += '<li>' + i + '</li>';
        }
    }
    pagingControls += '</ul>';
    $(container).html(pagingControls);
}
}

那么,有什么想法吗?

【问题讨论】:

    标签: wordpress pagination reset jquery


    【解决方案1】:

    我的回答是通过 ajax 重新加载带有帖子的当前页面。

    • 通过javascript和php生成分页没有问题
    • 初始加载和后续加载的行为相同(当用户隐藏帖子时)
    • 您可以使用 jquery 轻松实现分页

    【讨论】:

    • 这怎么可能实现?
    猜你喜欢
    • 1970-01-01
    • 2015-10-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2014-03-23
    • 1970-01-01
    相关资源
    最近更新 更多