在WordPress中使用ajax分页，并在archive.php上自定义帖子类型

Question

不知道有人能帮上忙，这让我发疯。 我有一个存档页面，其中包含新闻报道的列表。 现在，这些新闻报导由ajax调用控制，可以基于下拉菜单填充和更改新闻，下拉菜单包含自定义分类法（本例中为3个主题，行业和技术）。 无论如何，我遇到的问题是我无法在任何职位上进行分页工作。 我不，它与ajax调用及其调用函数有关，但我无法使其正常工作。 我已经设法显示分页号，但是当我单击它们时，它将带我到我的网址/wp-admin/wp-ajax.php，这显然是错误的。 我已经做了很长时间，所以任何帮助或指导都会有所帮助。

  var base = window.location.pathname + window.location.search; var technologies = document.querySelector('#category').value; var sectors = document.querySelector('#sectors').value; var topics = document.querySelector('#topics').value; var sort = document.querySelector('#sort').value; var type = window.location.pathname.split('/')[1]; var ajaxurl = 'http://www.mywebsite.com/wp-admin/admin-ajax.php'; jQuery.ajax({ type: 'GET', url: ajaxurl, data: { "action": "load_news", tech: '*' , sector: '*' , topic: '*' , sorting: sort, type:type, base:base }, success: function(response) { jQuery(".news-slider").html(response); return false; } }); 

上面是我的jQuery ajax调用，下面是functions.php

                    add_action( 'wp_ajax_nopriv_load_news', 'prefix_load_term_news' );
                add_action( 'wp_ajax_load_news', 'prefix_load_term_news' );
                function prefix_load_term_news () {
                                $tech_id = $_GET[ 'tech' ];
                                $sector_id = $_GET[ 'sector' ];
                                $topic_id = $_GET[ 'topic' ];
                                $sort_filter = $_GET['sorting'];
                                $type = $_GET['type'];
                                $base = $_GET[ 'base' ];
                                $paged = ( get_query_var( 'paged' ) ) ? absint( get_query_var( 'paged' ) ) : 1;
                                $args = array (
                                                    'post_type' => $type,
                                                    'posts_per_page' =>2,
                                                    'paged' => $paged,
                                                    'order' => $sort_filter,
                                                    'tax_query' => array(
                                                        'relation' => 'OR',
                                                            array(
                                                                'taxonomy' => 'taxonomy-news',
                                                                'field'    => 'id',
                                                                'terms'    => $tech_id,
                                                            ),
                                                            array(
                                                                'taxonomy' => 'category',
                                                                'field'    => 'id',
                                                                'terms'    => $sector_id,
                                                            ),
                                                            array(
                                                                'taxonomy' => 'taxonomy-topics',
                                                                'field'    => 'id',
                                                                'terms'    => $topic_id,
                                                            ),
                                                    ),
                                             );
                        try {
                            $postslist = new WP_Query($args);

                            $big = 999999999; // This needs to be an unlikely integer
                        // For more options and info view the docs for paginate_links()
                        // http://codex.wordpress.org/Function_Reference/paginate_links
                        $paginate_links = paginate_links( array(
                            'base' => str_replace( $big, '%#%', get_pagenum_link($big) ),
                            'current' => max( 1, $postslist->get( 'paged' ) ),
                            'total' => $postslist->max_num_pages,
                        ) );
                        // Display the pagination if more than one page is found
                        if ( $paginate_links ) {
                            echo '<div class="pagination">';
                            echo $paginate_links;
                            echo '</div><!--// end .pagination -->';
                        }
                        }
                        catch (Exception $error) {
                            echo 'An error occurred while loading news posts. Please try again.';
                        }
                        ?>
                    <?php   if ( $postslist->have_posts() ) :
                            while ( $postslist->have_posts() ) : $postslist->the_post();
                                include('template-parts/content-archive-ajax.php');
                            endwhile;
                         wp_reset_postdata();
                 endif;
        }

Answer 1

如果您使用的是ajax，则无需在php中打印任何内容，您只需将分页链接放在php变量中，然后就可以使用json_encode（）将其发送回javascript，因此您的函数必须变成这样：

function prefix_load_term_news() {

$pagerLinks = '';
$errors = false;

$tech_id = $_GET['tech'];
$sector_id = $_GET['sector'];
$topic_id = $_GET['topic'];
$sort_filter = $_GET['sorting'];
$type = $_GET['type'];
$base = $_GET['base'];
$paged = ( get_query_var('paged') ) ? absint(get_query_var('paged')) : 1;
$args = array(
    'post_type' => $type,
    'posts_per_page' => 2,
    'paged' => $paged,
    'order' => $sort_filter,
    'tax_query' => array(
        'relation' => 'OR',
        array(
            'taxonomy' => 'taxonomy-news',
            'field' => 'id',
            'terms' => $tech_id,
        ),
        array(
            'taxonomy' => 'category',
            'field' => 'id',
            'terms' => $sector_id,
        ),
        array(
            'taxonomy' => 'taxonomy-topics',
            'field' => 'id',
            'terms' => $topic_id,
        ),
    ),
);
try {
    $postslist = new WP_Query($args);

    $big = 999999999; // This needs to be an unlikely integer
    // For more options and info view the docs for paginate_links()
    // http://codex.wordpress.org/Function_Reference/paginate_links
    $paginate_links = paginate_links(array(
        'base' => str_replace($big, '%#%', get_pagenum_link($big)),
        'current' => max(1, $postslist->get('paged')),
        'total' => $postslist->max_num_pages,
            ));
    // Display the pagination if more than one page is found
    if ($paginate_links) {
        $pagerLinks .= '<div class="pagination">';
        $pagerLinks .= $paginate_links;
        $pagerLinks .= '</div><!--// end .pagination -->';
    }
} catch (Exception $error) {
    $errors = true;
}

echo json_encode(array('errors' => $errors,'pagination' => $pagerLinks));

}

当javascript尝试获取成功回调上的响应时，Ajax调用中的PHP输出会导致错误

Answer 2

尝试以这种方式自己创建页面链接HTML。

function prefix_load_term_news() {
    $pager_data = (object) array('curr_url' => 'yourpage_url' );
    $pagerLinks = '';
    $errors = false;

    $tech_id = $_GET['tech'];
    $sector_id = $_GET['sector'];
    $topic_id = $_GET['topic'];
    $sort_filter = $_GET['sorting'];
    $type = $_GET['type'];
    $base = $_GET['base'];
    $paged = ( get_query_var('paged') ) ? absint(get_query_var('paged')) : 1;
    $args = array(
        'post_type' => $type,
        'posts_per_page' => 2,
        'paged' => $paged,
        'order' => $sort_filter,
        'tax_query' => array(
            'relation' => 'OR',
            array(
                'taxonomy' => 'taxonomy-news',
                'field' => 'id',
                'terms' => $tech_id,
            ),
            array(
                'taxonomy' => 'category',
                'field' => 'id',
                'terms' => $sector_id,
            ),
            array(
                'taxonomy' => 'taxonomy-topics',
                'field' => 'id',
                'terms' => $topic_id,
            ),
        ),
    );
    try {
        $postslist = new WP_Query($args);

        $big = 999999999; // This needs to be an unlikely integer
        // For more options and info view the docs for paginate_links()
        // http://codex.wordpress.org/Function_Reference/paginate_links
        $paginate_links = paginate_links(array(
            'base' => str_replace($big, '%#%', get_pagenum_link($big)),
            'current' => max(1, $postslist->get('paged')),
            'total' => $postslist->max_num_pages,
                ));

        $paginate_links = '<ul id="pagelinks">';

            if ($postslist->get('paged') > 1) {

               $paginate_links .= '<li id="first-page" class="page-numb"><a href="' . $pager_data->curr_url . '?pag='.($postslist->get('paged') - 1).'"><i class="fa fa-chevron-left"></i></a></li>';
             } 

            if ($pager_data->max_num_pages < 6) {

                for ($p = 1; $p <= $pager_data->max_num_pages; $p++) {
                    $is_active = '';
                    if ($p == $postslist->get('paged')) {
                        $is_active = 'active';
                    }
                    $paginate_links .= '<li class="page-numb ' . $is_active . '" data-page="' . $p . '"><a href="' . $pager_data->curr_url . '?pag=' . $p . '">' . $p . '</a></li>';
                }
            } else {
                if ($postslist->get('paged') > 2) {

                    $paginate_links .= '<li class="dots">...</li>'
                    . '<li class="page-numb"><a href="' . $pager_data->curr_url . '?pag=' . ($postslist->get('paged') - 1) . '">' . ($postslist->get('paged') - 1) . '</a></li>'
                    . '<li class="page-numb active" ><a href="' . $pager_data->curr_url . '?pag=' . $postslist->get('paged') . '">' . $postslist->get('paged') . '</a></li>'
                    . '<li class="page-numb" ><a href="' . $pager_data->curr_url . '?pag=' . ($postslist->get('paged') + 1) . '">' . ($postslist->get('paged') + 1) . '</a></li>'
                    . '<li class="dots">...</li>';
                } else {
                    for ($p = 1; $p <= 5; $p++) {
                        $is_active = '';
                        if ($p == $postslist->get('paged')) {
                            $is_active = 'active';
                        }
                        $paginate_links .= '<li class="page-numb ' . $is_active . '" ><a href="' . $pager_data->curr_url . '?pag=' . $p . '">' . $p . '</a></li>';
                    }
                    $paginate_links .= '<li class="dots">...</li>';
                }
            }

            if ($postslist->get('paged') < $pager_data->max_num_pages) {

                $paginate_links .= '<li id="last-page" class="page-numb"><a  href="'. $pager_data->curr_url .'?pag='. ($postslist->get('paged') + 1).'"><i class="fa fa-chevron-right"></i></a></li>';
                   } 
        $paginate_links .= '</ul>';

        // Display the pagination if more than one page is found
        if ($paginate_links) {
            $pagerLinks .= '<div class="pagination">';
            $pagerLinks .= $paginate_links;
            $pagerLinks .= '</div><!--// end .pagination -->';
        }
    } catch (Exception $error) {
        $errors = true;
    }

    echo json_encode(array('errors' => $errors,'pagination' => $pagerLinks));
}

该代码只是一个示例，您必须在$ pager_data-> curr_url中指示正确的URL的地方进行更改。 链接中的页码是一个GET变量，我将其命名为“ pag”，您将其放入“数据”属性中，并编写了jQuery函数来获取它，并进行了新的Ajax调用以在页面之间进行切换