在archive.php上使用自定义post类型的wordpress中的Ajax分页
在archive.php上使用自定义post类型的wordpress中的Ajax分页
提问于 2019-01-21 22:52:33
不知道有没有人能帮上忙，因为这快把我逼疯了。我有一个存档页面，上面有新闻故事的列表。现在，这些新闻故事由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;
}回答 2
Stack Overflow用户
发布于 2019-01-21 23:42:42
如果你使用的是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输出会导致错误
Stack Overflow用户
发布于 2019-01-22 00:35:32
尝试用这种方式自己创建页面链接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“，您可以将页码放入"data”属性中，然后编写一个jQuery函数来获取它，并进行一个新的ajax调用以在页面之间切换
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54292488
复制相关文章
相似问题
腾讯云开发者
