【发布时间】:2015-10-13 17:59:39
【问题描述】:
我浏览了旧问题并尝试了许多似乎可以做到这一点的不同方法。我最接近工作的是这里:How to implement pagination on a custom WP_Query Ajax
我已经尝试了所有方法,但它不起作用。页面上绝对没有任何变化。如果您检查加载更多按钮并单击它,jQuery 正在执行加载更多按钮操作,因为它从<a id="more_posts">Load More</a> 更改为<a id="more_posts" disables="disabled">Load More</a>,即使这对我来说似乎也不正确。这不是添加帖子,我想我错过了一些简单的东西,但对于我的生活我无法解决。
我的模板文件中的代码是:
<div id="ajax-posts" class="row">
<?php
$postsPerPage = 3;
$args = [
'post_type' => 'post',
'posts_per_page' => $postsPerPage,
'cat' => 1
];
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post(); ?>
<div class="small-12 large-4 columns">
<h1><?php the_title(); ?></h1>
<p><?php the_content(); ?></p>
</div>
<?php
endwhile;
echo '<a id="more_posts">Load More</a>';
wp_reset_postdata();
?>
</div>
我的函数文件中的代码是:
function more_post_ajax(){
$offset = $_POST["offset"];
$ppp = $_POST["ppp"];
header("Content-Type: text/html");
$args = [
'suppress_filters' => true,
'post_type' => 'post',
'posts_per_page' => $ppp,
'cat' => 1,
'offset' => $offset,
];
$loop = new WP_Query($args);
while ($loop->have_posts()) { $loop->the_post();
the_content();
}
exit;
}
add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax');
add_action('wp_ajax_more_post_ajax', 'more_post_ajax');
而我在页脚中的 jQuery 是:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready( function($) {
var ajaxUrl = "<?php echo admin_url('admin-ajax.php')?>";
// What page we are on.
var page = 5;
// Post per page
var ppp = 3;
$("#more_posts").on("click", function() {
// When btn is pressed.
$("#more_posts").attr("disabled",true);
// Disable the button, temp.
$.post(ajaxUrl, {
action: "more_post_ajax",
offset: (page * ppp) + 1,
ppp: ppp
})
.success(function(posts) {
page++;
$("#ajax-posts").append(posts);
// CHANGE THIS!
$("#more_posts").attr("disabled", false);
});
});
});
</script>
任何人都可以看到我缺少的东西或能够提供帮助的东西吗?
【问题讨论】:
-
非常感谢您为帮助我所做的努力,但我仍然无法正常工作。我的加载更多按钮不可点击?你知道为什么会这样吗?
-
不知道你有没有看到我下面的评论,但是如果你把你的ajax代码放在custom.js中,那么代码应该是这样的: wp_enqueue_script('custom_js', get_template_directory_uri() . '/assets/js/custom.js', array('jquery'), '', true); wp_localize_script('custom_js', 'ajax_posts', array('ajaxurl' => admin_url('admin-ajax.php'), 'noposts' => __('没有找到旧帖子', 'fireproduct'), ));
标签: javascript php jquery ajax wordpress