wordpress jQuery ajax 加载不需要的重复帖子

Question

我会尽力解释。基本上我有一个项目网格（砌体），我想在每个网格 div（红色）内附加 ajax 加载的内容（wordpress single.php 帖子）。

我在填充内容的每个红色 div 中都有一个名为 ajaxcontainer 的 div 类。当我单击 a href 触发器内容时，它应该被附加，这工作一次，但是当我单击网格中的另一个项目时，旧的 ajaxcontainer 会填充来自该 href 的新内容。基本上是重复的。

我希望旧的 ajaxcontainer 保留旧内容，即使我单击了另一个项目。

HTML

<article style="background:<?php echo $color ?>;" id="post-<?php the_ID(); ?>" 
<?php post_class($classes); ?>>


<div class="hover">
<h2><?php echo $head ?></h2>
<p class="tags"><?php echo $tagsstring; ?></p>

<a href="//<?php echo $url ?>"><?php echo $url ?></a>
<a class="trick" rel="<?php the_permalink(); ?>" href="<?php the_permalink();?>">goto</a>
</div>

<div class="thumbnail <?php echo $paddingstring?>" style="background-image:url(<?php echo $thumbnail[0] ?>);">

</div>


</article><!-- #post-## -->

我现在拥有的：

   $.ajaxSetup({
       cache: false,
       success: function (result, status, xhr) {
           // not showing the alert
           console.log('success');
           var $this = jQuery(this)
           $('.ajaxcontainer', $this).hide().fadeIn();
       },
       beforeSend: function () {
           console.log('beforesend');
           $(".ajaxcontainer").html("loading...");


       },
       complete: function (xhr, stat) {
           // hide dialog // works

       }
   });
   $(".trick").each(function () {
       $(this).on("click", function (e) {
           $(this).parents('.item').append("<div class='ajaxcontainer'>hello world</div>")

           var post_link = $(this).attr("href");
           $(".ajaxcontainer").load(post_link + ' #content');
           return false;
       });
   });

任何帮助表示赞赏:)

Answer 1

我可能错了，但据我所知，如果您有重复的内容，next() 可能会有所帮助。

函数中类似于 $(this).parents('.item').next().append("hello world")。