如何使用Ajax onclick加载WordPress Post

我花了几个小时阅读和尝试教程。 我似乎无法找到一个有效的解决方案，我知道它应该很容易，但我很难与AJAX。 🙁

我想从div中的链接加载Post内容。 以下是我所拥有的。 有人可以帮我解决JavaScript方面的问题吗？ 谢谢！

我想在div #loadAjaxHere中加载此代码

感谢您的帮助！！

Answer 1

好吧，经过长时间的反复试验，我想我已经解决了这个问题。

这似乎有效，但如果不是这样做的正确方法，请告诉我

使用Javascript：

 jQuery.noConflict(); jQuery(document).ready(function($){ $.ajaxSetup({cache:false}); $("a.ajax").click(function(){ var post_url = $(this).attr("href"); var post_id = $(this).attr("rel"); $("#tabs").html('
loading...
'); $("#tabs").load(post_url); return false; }); }); 

我要显示post内容的页面（我使用的是名为“艺术品”的自定义post类型：

而单一post“single-artwork.php”。 注意：不要使用get_header或get_footer等：

谢谢！

Answer 2

只是补充一下，如果您只想加载部分单个post，您可以进行修改

 $("#tabs").load(post_url); 

至

 $("#tabs").load(post_url + ".tabcontent" ); 

哪个只会加载div.tabcontent中的所有内容

Answer 3

Barry的答案是正确的，因为能够通过在URL的末尾添加css选择器表达式来加载部分页面。 但是，url和选择器之间需要有一个空格，如下所示：

 $("#tabs").load(post_url + " .tabcontent" ); 

否则传递给.load()的字符串将是http://example.com.tabscontent 。 但它应该是http://example.com .tabscontent 。

另外，使用此方法的明智之处将阻止jQuery加载并执行标记内的任何代码。 但是，只需使用.load(post_url); 没有选择器会成功加载并执行标记中的代码。

在这里阅读更多相关信息。