分页不起作用AJAX请求(Pagination not working AJAX request)

我想对AJAX请求的结果进行分页。分页不起作用。点击页码后，只有地址和所有内容（例如：/ page / 3 /）发生变化。我在哪里犯了一个错误？

page.php文件

<div class="site-content clearfix"> <h1>Alex Blog</h1> <?php $ourCurrentPage = get_query_var('paged'); $aboutPosts = new WP_Query(array( 'post_type' => 'tour', 'post_status' => 'publish', 'posts_per_page' => 3, )); if ($aboutPosts->have_posts()) : while ($aboutPosts->have_posts()) : $aboutPosts->the_post(); ?> <span> <?php the_title(); ?> </span> <br> <?php endwhile; echo paginate_links(array( 'total' => $aboutPosts->max_num_pages )); endif; ?> </div>

FUNCTION.PHP

JS代码

function tourcat_orderby_posts() { $.ajax({ url: ajaxurl, data: { 'action':'tourcat_ajax_by_order', }, success: function(data) { // This outputs the result of the ajax request $(".tour_parent_div").html(data); }, error: function(errorThrown) {} });}

I want to make a pagination of the results of the AJAX request. Pagination does not work. After clicking the page number, only the address and everything (example: / page / 3 /) change. Where did I make a mistake?

PAGE.PHP

<div class="site-content clearfix"> <h1>Alex Blog</h1> <?php $ourCurrentPage = get_query_var('paged'); $aboutPosts = new WP_Query(array( 'post_type' => 'tour', 'post_status' => 'publish', 'posts_per_page' => 3, )); if ($aboutPosts->have_posts()) : while ($aboutPosts->have_posts()) : $aboutPosts->the_post(); ?> <span> <?php the_title(); ?> </span> <br> <?php endwhile; echo paginate_links(array( 'total' => $aboutPosts->max_num_pages )); endif; ?> </div>

FUNCTION.PHP

JS CODE

function tourcat_orderby_posts() { $.ajax({ url: ajaxurl, data: { 'action':'tourcat_ajax_by_order', }, success: function(data) { // This outputs the result of the ajax request $(".tour_parent_div").html(data); }, error: function(errorThrown) {} });}

最满意答案

这不是没有正确实施，你可以尝试以下方法：

page.php文件

在将内容添加到内容后使用相同的标记和调用：

<div class="site-content clearfix"> <h1>Alex Blog</h1> <div id="page-posts-wrapper"> <?php $ourCurrentPage = get_query_var('paged'); $aboutPosts = new WP_Query(array( 'post_type' => 'tour', 'post_status' => 'publish', 'posts_per_page' => 3, )); if ($aboutPosts->have_posts()) : while ($aboutPosts->have_posts()) : $aboutPosts->the_post(); ?> <span> <?php the_title(); ?> </span> <br> <?php endwhile; echo paginate_links(array( 'total' => $aboutPosts->max_num_pages )); endif; ?> </div> </div>

FUNCTION.PHP

加载js文件并将查询数据本地化以稍后用于页面生成：

function custom_assets_39828328() { // Correct the path and js file name before using. wp_enqueue_script( 'ajax-pagination', get_stylesheet_directory_uri() . '/js/ajax-pagination.js', array(), '1.0', true ); global $wp_query; wp_localize_script( 'ajax-pagination', 'ajaxpagination', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'query_vars' => json_encode( $wp_query->query ) )); } add_action( 'wp_enqueue_scripts', 'custom_assets_39828328' );

编写浏览页面时将使用的回调函数：

/** * AJAX Pagination function */ function my_ajax_pagination_72372732() { $query_vars = json_decode( stripslashes( $_POST['query_vars'] ), true ); $query_vars['post_type'] = 'tour'; $query_vars['paged'] = $_POST['page']; $query_vars['post_status'] = 'publish'; $query_vars['posts_per_page'] = 3; $posts = new WP_Query( $query_vars ); $GLOBALS['wp_query'] = $posts; if( ! $posts->have_posts() ) { echo 'No results found'; } else { while ( $posts->have_posts() ) { $posts->the_post(); ?> <span> <?php the_title(); ?> </span><br> <?php } echo paginate_links(array('total' => $posts->max_num_pages )); } die(); } add_action( 'wp_ajax_nopriv_ajax_pagination', 'my_ajax_pagination_72372732' ); add_action( 'wp_ajax_ajax_pagination', 'my_ajax_pagination_72372732' );

JS代码

通过Ajax将必要的细节传递给调用函数并显示响应：

你也可以用这个（可选的）替换ajax回调查询参数：

$new_args = array( 'post_type' => 'post', 'post_status' => 'publish', 'paged' => $_POST['page'], 'posts_per_page' => 3, );

将在两种情况下工作。

This is not not implemented correctly, you can try the following:

PAGE.PHP

Use the same markup and call after adding a wrapper to the content:

<div class="site-content clearfix"> <h1>Alex Blog</h1> <div id="page-posts-wrapper"> <?php $ourCurrentPage = get_query_var('paged'); $aboutPosts = new WP_Query(array( 'post_type' => 'tour', 'post_status' => 'publish', 'posts_per_page' => 3, )); if ($aboutPosts->have_posts()) : while ($aboutPosts->have_posts()) : $aboutPosts->the_post(); ?> <span> <?php the_title(); ?> </span> <br> <?php endwhile; echo paginate_links(array( 'total' => $aboutPosts->max_num_pages )); endif; ?> </div> </div>

FUNCTION.PHP

Load js file and localize query data to use later for page generation:

function custom_assets_39828328() { // Correct the path and js file name before using. wp_enqueue_script( 'ajax-pagination', get_stylesheet_directory_uri() . '/js/ajax-pagination.js', array(), '1.0', true ); global $wp_query; wp_localize_script( 'ajax-pagination', 'ajaxpagination', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ), 'query_vars' => json_encode( $wp_query->query ) )); } add_action( 'wp_enqueue_scripts', 'custom_assets_39828328' );

Write the callback function that will be used when browsing the pages:

/** * AJAX Pagination function */ function my_ajax_pagination_72372732() { $query_vars = json_decode( stripslashes( $_POST['query_vars'] ), true ); $query_vars['post_type'] = 'tour'; $query_vars['paged'] = $_POST['page']; $query_vars['post_status'] = 'publish'; $query_vars['posts_per_page'] = 3; $posts = new WP_Query( $query_vars ); $GLOBALS['wp_query'] = $posts; if( ! $posts->have_posts() ) { echo 'No results found'; } else { while ( $posts->have_posts() ) { $posts->the_post(); ?> <span> <?php the_title(); ?> </span><br> <?php } echo paginate_links(array('total' => $posts->max_num_pages )); } die(); } add_action( 'wp_ajax_nopriv_ajax_pagination', 'my_ajax_pagination_72372732' ); add_action( 'wp_ajax_ajax_pagination', 'my_ajax_pagination_72372732' );