问题描述
限时送ChatGPT账号..我尝试使用 ajax 加载更多帖子.我看到在线和 stackoverflow 中有很多插件和解决方案.但对我来说没有任何作用.其实我想在没有插件的情况下做到这一点.因此,我可以在需要此代码的不同页面存档或不同页面模板中使用它.
这是我从 stackoverflow 的另一个问题中得到的代码.我的分数较低,所以我不能在那里发表评论.
这是我的 index.php 代码:
<?php get_header();?><div class="ajax-posts"><?php$postsPerPage = 3;$args = 数组('post_type' =>'邮政','posts_per_page' =>$postsPerPage,);$loop = new WP_Query($args);while ($loop->have_posts()) : $loop->the_post();?><h2><?php the_title();?></h2><?php终了;echo '<a id="more_posts" href="#">加载更多</a>';wp_reset_postdata();?><script type="text/javascript">var ajaxUrl = "<?php echo admin_url('admin-ajax.php')?>";var 页面 = 1;.var ppp = 3;$("#more_posts").on("click",function(){$("#more_posts").attr("disabled",true);$.post(ajaxUrl, {动作:more_post_ajax",偏移量:(页 * ppp)+ 1,ppp: ppp}).成功(功能(帖子){页面++;$(".ajax-posts").append(posts);//改变这个!$("#more_posts").attr("disabled",false);});});<?php get_footer();?>
这是functions.php代码
<?php函数 more_post_ajax(){$offset = $_POST["offset"];$ppp = $_POST["ppp"];header("Content-Type: text/html");$args = 数组('post_type' =>'邮政','posts_per_page' =>$ppp,'偏移' =>$偏移量,);$loop = new WP_Query($args);while ($loop->have_posts()) { $loop->the_post();标题();}出口;}add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax');add_action('wp_ajax_more_post_ajax', 'more_post_ajax');?>
我不知道为什么帖子无法加载或无法加载更多链接.我希望有人会帮忙.
参考:https://stackoverflow/a/31588401/5545813
解决方案更好的方法是返回一个包含你的帖子标题的数组.然后在成功后显示它们.如果数组长度<ppp(没有更多帖子了).
$array_return = array();$loop = new WP_Query($args);while ($loop->have_posts()) { $loop->the_post();$content = "".get_the_title() ."</h1>";$content .="".get_the_content() ."</div>";$content .= "".get_field("your_field") ."</div>";$array_return[] = $content;}回声 json_encode( $array_return );死();
在您的 js 脚本中,
var posts = JSON.parse(posts);for( var i = 0; i
类似的东西
I tried to load more posts using ajax. I see there is lot of plugins and solutions in online and stackoverflow. But none of work for me. Actually I want to do this without plugin. So I can use this in different page archive or different page template where I need this code.
Here is my code that I got from another question in stackoverflow. My score is lower, so I can't comment out there.
Here is my index.php code:
<?php get_header(); ?>
<div class="ajax-posts">
<?php
$postsPerPage = 3;
$args = array(
'post_type' => 'post',
'posts_per_page' => $postsPerPage,
);
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post();
?>
<h2><?php the_title(); ?></h2>
<?php
endwhile;
echo '<a id="more_posts" href="#">Load More</a>';
wp_reset_postdata();
?>
</div>
<script type="text/javascript">
var ajaxUrl = "<?php echo admin_url('admin-ajax.php')?>";
var page = 1;.
var ppp = 3;
$("#more_posts").on("click",function(){
$("#more_posts").attr("disabled",true);
$.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>
<?php get_footer(); ?>
Here is functions.php code
<?php
function more_post_ajax(){
$offset = $_POST["offset"];
$ppp = $_POST["ppp"];
header("Content-Type: text/html");
$args = array(
'post_type' => 'post',
'posts_per_page' => $ppp,
'offset' => $offset,
);
$loop = new WP_Query($args);
while ($loop->have_posts()) { $loop->the_post();
the_title();
}
exit;
}
add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax');
add_action('wp_ajax_more_post_ajax', 'more_post_ajax');
?>
I don't know why posts not load or not work load more link. I hope someone will be help.
Ref: https://stackoverflow/a/31588401/5545813
解决方案The better way is to return an array with ur post title. Then display them after the success. If the array length < ppp (there is no more post).
$array_return = array();
$loop = new WP_Query($args);
while ($loop->have_posts()) { $loop->the_post();
$content = "<h1>" . get_the_title() . "</h1>";
$content .= "<div>" . get_the_content() . "</div>";
$content .= "<div>" . get_field("your_field") . "</div>";
$array_return[] = $content;
}
echo json_encode( $array_return );
die();
In your js script,
var posts = JSON.parse(posts);
for( var i = 0; i < posts.length; i++ )
$(".ajax-posts").append(posts[i]);
if( posts.length < ur_ppp )
$("#more_posts").fadeOut();
Something like that
这篇关于wp 帖子 ajax 加载更多的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
更多推荐
[db:关键词]
发布评论