WordPress加载更多postonclick with ajax request jquery

我从头开始使用_S入门主题开发自定义主题。 我有问题点击阅读更多按钮，通过ajax请求获得Wordpress下一篇文章。 我已经尝试了很多文章，特别是以下文章，但没有运气。

参考链接：

• 在Wordpress中加载更多postAjax按钮
• 使用AJAX加载下一个WordPresspost
• 使用AJAX在同一页面上加载旧的WordPresspost

我已尝试使用上面的自定义循环并使用jquery脚本添加自定义函数但它不能以某种方式工作。

这是下面的循环代码示例：

在index.php中循环

 
 
  
   
Sorry no posts are created yet.
 
Please create some posts to see it in action.
  Load More 

我正在搞这个问题超过4-5天，所以任何人都可以帮助我解决这个问题，工作解决方案将非常值得注意。

提前致谢。

Answer 1

我可能有一个解决方案。

首先要确保在主题中加入一个脚本

 wp_enqueue_script('your_js_hanlde', get_template_directory_uri() . '/js/your_js_hanlde.js', array('jquery'), '1.0.0', true ); 

然后本地化添加一个函数来在你的dom中添加一个js var

 wp_localize_script('your_js_hanlde', 'ajaxurl', admin_url( 'admin-ajax.php' ) ); 

在您的js中，在“加载更多”按钮的“点击”上添加一个事件

传递动作名称和dom中的文章数量，响应在按钮“加载更多”之前添加内容

 $("#load_more").click(function() { $.post(ajaxurl, { 'action': 'your_load_more', 'count': $("article.post-item").length }, function(response) { var posts = JSON.parse(response); for( var i = 0; i < posts.length; i++ ) { if( posts[i] == "0" ) $("#load_more").fadeOut(); else $("#load_more").before(posts[i]); } }); }); 

在functions.php中创建一个函数

 function your_load_more() { $count = $_POST["count"]; $cpt = 1; $args = array( 'posts_per_page' => -1, 'post_type' => 'post', // change the post type if you use a custom post type 'post_status' => 'publish', ); $articles = new WP_Query( $args ); $ar_posts = array(); if( $articles->have_posts() ) { while( $articles->have_posts() ) { $articles->the_post(); $one_post = ""; if( $cpt > $count && $cpt < $count+6 ) { $one_post .= "
"; $one_post .= "
" . get_the_title() . "
"; $one_post .= "
"; $ar_posts[] = $one_post; if( $cpt == $articles->found_posts ) $ar_posts[] = "0"; } $cpt++; } } echo json_encode($ar_posts); die(); } add_action( 'wp_ajax_your_load_more', 'your_load_more' ); add_action( 'wp_ajax_nopriv_your_load_more', 'your_load_more' ); 

它对我有用。 我希望能帮助你。