javascript - wordpress ajax 调用单个帖子

Question

我尝试在我的wordpress循环中进行ajax调用，基本上我想在单击标题后将主页中的帖子内容加载到div中。调用 ajax 似乎有效，但我在加载整个页面时遇到问题，并且我只想加载具有特定 id 的 div 的内容。

这是我的代码:index.php

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <a class="post-link" rel="<?php the_ID(); ?>" href="<?php the_permalink(); ?>">
       <?php the_title(); ?> 
    </a>
    <?php endwhile; endif; ?>
<div id="single-post-container"></div>

这是 single.php

<?php $post = get_post($_POST['id']); ?>
    <div id="single-post post-<?php the_ID(); ?>">
    <?php while (have_posts()) : the_post(); ?>
                <?php the_title();?>
                <?php the_content();?>
    <?php endwhile;?> 
    </div>

这是 js

   jQuery(document).ready(function(){

        jQuery.ajaxSetup({cache:false});
        jQuery(".post-link").click(function(){
            var post_link = jQuery(this).attr("href");

            jQuery("#single-post-container").html("content loading");
            jQuery("#single-post-container").load(post_link);
        return false;
        });

    });

我尝试在 post_link 之后添加 id #single-post，如下所示:

  jQuery("#single-post-container").load(post_link #single-post);

但是当我运行 gulp 时，我遇到了一个阻止我的错误。我怎样才能达到这个范围？

有人可以给我帮助或建议吗？

Answer 1

我认为这可能是答案，但前提是我正确理解了问题:

什么是 post_link？您的 AJAX 调用实际调用的 URL 是什么？如果您只是调用 single.php，那么首先要做的就是调用 header() - 因此您可能会获得整个页面。看看你的index.php，我认为这可能就是正在发生的事情。

如果是这样的话。您需要了解如何在 WordPress 中进行 AJAX 调用。您必须使用 add_action('wp_ajax_my_action', mycallback) 之类的内容添加 AJAX 回调。然后你的回调可以通过 get_post() 获取单个帖子。您的 AJAX 调用应该调用的实际 url 类似于:

yourdomain/wp-admin/admin-ajax.php?action=my_action&post_id=THEPOSTID。您可以使用 admin_url() 来帮助您构建正确的 url。

您可能需要将 THEPOSTID 注入(inject)您的 JavaScript 中。使用 wp_localize_script。或者您可以将其添加为 index.php 中的属性并在 JavaScript 中获取它。

然后你的回调 - mycallback() - 可以使用 get_post() 来获取帖子并返回它，而不包含所有页面内容。例如:

function mycallback()
{

   $postId = $_GET['post_id'];
   $postRow = get_post($postId);
   echo $postRow->post_content; 
   wp_die();
}

也许寻找一些有关如何使用 WordPress 进行 AJAX 的示例？例如http://wptheming.com/2013/07/simple-ajax-example/

更新:

添加了wp_die()；在 AJAX 回调结束时。您需要这样做才能阻止 WordPress 吐出大量页面 bumf。事实上，这可能是您的 single.php 中缺少的部分。不过，也许无论如何使用 admin-ajax.php 可能会更好。