点击

时间:2019-03-05 14:04:17

标签: javascript jquery wordpress

我有下一个代码:

$('.left article').on('click', function(event) {
   var article_content = $(this).children('.article-content').html()
	$('.right').html(article_content);
});
* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

section {
  display: flex;
}

section > div {
  flex: 0 0 50%;
  padding: 15px;
  width: 50%;
}

.left .article-content {
  display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section>
  <div class="left">
     <article>
        <h2>My post title</h2>
        <div class="article-content"><p>This is the content for the first article</p></div>
        </article>

     <article>
        <h2>Another post title</h2>
        <div class="article-content"><p>Content for the the second post</p></div>
        </article>

     <article>
        <h2>Third post title</h2>
        <div class="article-content"><p>This is the content for the third post</p></div>
        </article>
  </div>


  <div class="right">

  </div>
</section>

我想在我的wordpress代码中实现相同的原理,以显示帖子的标题及其内容,此外,我想添加一个新列,其中包含来自不同自定义帖子类型的帖子列表(例如:testpostype ),具有相同“标签”的内容,由用户添加的内容。

例如:我有BOOK帖子类型的帖子列表,每个帖子都有不同的标记,1 -tag1,2 -tag 2,3 -tag3。同时,我还有其他customp帖子类型(testpostype) ,其中我的帖子也带有与我的BOOK帖子类型相同的标签。我想在单击BOOK帖子类型的第一个帖子时,获取该帖子的内容,以及第二个帖子类型(testpostype)的帖子列表,其中将包含相同的标记。例如:我点击第一个帖子(带有tag1)+我获得内容+我从第二个帖子类型中获得带有tag1的帖子。

我有下一个代码,但是我必须对其进行修改以获得相同的结果。谁知道呢?

<section>
        <div class="left">
           <?php global $post;
                 $wpposts = get_posts('numberposts=3&post_type=>book');
                  foreach($wpposts as $post):
                     setup_postdata($post);
           ?>
            <article>
                <h2>
                    <ul>
                       <li>
                          <?php the_title(); ?>
                      </li>
                    </ul>
                </h2>
                <div class="article-content">
                    <p>
                    <?php the_content(); ?>
                    </p>
                </div>
            </article>
           <?php endforeach; ?>
        </div>
        <div class="right">
        </div>
    </section>

0 个答案:

没有答案