WordPress，我如何AJAX额外的post

JQUERY UPDATE

 jQuery(function($){ function fetchBlogPosts(){ $.post( ajaxUrl, {'action' : 'post_blog', 'security' :'' }, function(response){ }); } $('.load-more').click(function(){ fetchBlogPosts(); }); });  

PHPfunction更新

 add_action('wp_ajax_post_blog', 'blog_post_data_fetch'); add_action('wp_ajax_nopriv_post_blog', 'blog_post_data_fetch'); function blog_post_data_fetch(){ check_ajax_referer('load_more_posts', 'security'); ob_clean(); get_template_part( 'inc/blog','posts' ); wp_die(); } 

在阅读了几个AJAX教程后，老实说AJAX与WordPress仍然让我感到困惑:(我坚持使用下面的代码，它确实有效。

但是，我只是想在现有循环中添加其他post而不重复相同的post。

换句话说，初始页面加载下面的循环，然后当我点击“.load-more”按钮时，它应该通过AJAX加载更多post，但是已经显示的现有post抵消它。

这怎么可能呢？

的functions.php

 add_action('wp_ajax_post_blog', 'blog_post_data_fetch'); add_action('wp_ajax_nopriv_post_blog', 'blog_post_data_fetch'); function blog_post_data_fetch(){ get_template_part('inc/blog','posts'); } 

博客post模板

  'blog', )); if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?> 
 
 
 <a href="https://stackoverflow.com/questions/41006710/wordpress-how-do-i-ajax-additional-posts/">  <img src="https://stackoverflow.com/questions/41006710/wordpress-how-do-i-ajax-additional-posts//img/blog-thumb.jpg" alt="">   
 
 
hello
  
 
 
  

JQUERY

  function fetchBlogPosts(){ $.post( ajaxUrl, { 'action' : 'post_blog' }, function(response){ }); } $('.load-more').click(function(){ fetchBlogPosts(); }); 

Answer 1

您需要在PHP回调的末尾添加wp_die()或die() 。 PHP需要知道它已完成处理。 此外，nopriv事件不正确。

 add_action('wp_ajax_post_blog', 'blog_post_data_fetch'); add_action('wp_ajax_nopriv_post_blog', 'blog_post_data_fetch'); /** * Processes the Ajax request for the action: post_blog. * * @since 1.0.0 * * @return void */ function blog_post_data_fetch(){ // You need to check the nonce here first! // Let's keep our web pages safe. // Then if the nonce is correct, you can do the // processing. ob_clean(); get_template_part( 'inc/blog','posts' ); // When you're done, make sure you exit PHP wp_die(); } 

解释AJAX和WordPress

让我解释一下发生了什么。

服务器处理了业务逻辑，构建了HTML标记和资产，然后将它们发送到浏览器。 服务器现已完成。

AJAX为您提供了回调服务器并让它为您进行更多处理的方法。 周期是：

• AJAX回发到服务器
• 服务器接收请求
• 您检查nonce以确保它是有效请求
• 然后你做一些处理
• 打包退货并将其发回给请求
• 您的脚本会收到响应并继续。

在您的情况下，您使用$.post将呼叫回$.post服务器。 WordPress收到请求，然后触发2个事件：

• wp_ajax_{your ajax action}
• wp_ajax_nopriv_{your ajax action}

如果用户已登录，则第一个事件将触发并提供访问权限。第二个事件（即nopriv）将触发，无论他们是否已登录。

然后WordPress运行您注册到上述事件名称的回调。 您的示例回调是blog_post_data_fetch() 。

现在在您的代码中，您需要添加随机数检查以确保其安全。 如果通过，则可以处理请求。 如果要返回一个字符串，则可以将其回显（或者只调用视图/模板文件）。 如果它是一个数组，那么你需要序列化它，例如json_encode 。

PHP在执行die()或wp_die()构造时完成。

现在响应被发送回jQuery。 $.post收到回复。 现在你可以用它做点什么了。

在您的情况下，您发回一些HTML标记。 您需要决定将此标记添加到网页的位置。

关于AJAX的教程

有关WordPress实现AJAX的大量教程：

• Codex的插件中的Ajax
• 处理 Pippins的Ajax请求
• Tom McFarlin 改进了Ajax技术

完成准则

我给了你PHP端的代码（减去nonce安全检查）。 接下来，您需要将以下内容添加到jQuery脚本中：

• 发送安全检查（nonce）
• 如果您收到字符串， 则通过将响应添加到您想要的网页来处理响应

还要确保通过将WordPress中的AJAX URL（可能是nonce）发送到脚本来本地化参数 。