问在用户单击锚点后加载wordpress帖子
EN

Stack Overflow用户

提问于 2013-07-14 09:37:06

回答 1查看 123关注 0票数 0

这是我的选项卡菜单，用户可以在其中选择选项卡

<div id="slider-menu" class="row">
    <div class="span12">
        <ul class="nav nav-tabs" id="myTab">
            <li class="active"><a href="#home">Latest events</a><div class="triangle"></div></li>
            <li><a href="#profile">Our champions</a></li>
            <li><a href="#messages">We have puppies!</a></li>
        </ul>
    </div>
</div>

还有一些我的标签，其中的内容会在页面加载时加载

    <div class="tab-content">
        <div class="tab-pane active" id="home">
            <img src="<?php bloginfo('template_url'); ?>/img/slider.png" />
            <div class="span12">
                <?php 
                 query_posts('cat=7');
                    if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title=""><?php the_title(); ?></a></h3>
                    <?php the_content(); ?>
                    <?php endwhile; else: ?>
                    <p>Sorry, no posts matched your criteria.</p>
                    <?php endif; ?>
            </div>
        </div>
        <div class="tab-pane" id="profile">
            <img src="<?php bloginfo('template_url'); ?>/img/slider.png" />
            <div class="span12">
                <?php 
                 query_posts('cat=8');
                    if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title=""><?php the_title(); ?></a></h3>
                    <?php the_content(); ?>
                    <?php endwhile; else: ?>
                    <p>Sorry, no posts matched your criteria.</p>
                    <?php endif; ?>
            </div>
        </div>
        <div class="tab-pane" id="messages">
            <img src="<?php bloginfo('template_url'); ?>/img/slider.png" />
            <div class="span12">
                <?php 
                 query_posts('cat=9');
                    if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
                    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title=""><?php the_title(); ?></a></h3>
                    <?php the_content(); ?>
                    <?php endwhile; else: ?>
                    <p>Sorry, no posts matched your criteria.</p>
                    <?php endif; ?>
            </div>
        </div>
     </div>

当有很多帖子时，页面加载时间太长，所以我的基本想法是在页面加载时将所有帖子加载到第一个选项卡，当用户选择另一个选项卡时将帖子加载到另一个选项卡。

我苦苦思索如何结合wp post循环和ajax来在用户单击特定选项卡时加载帖子。

提前感谢您的帮助。

wordpress

jquery

大模型视频创作引擎特惠

提供高质量视频生成与处理服务，技术领先、效果专业、应用广泛，新用户3折起！

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-07-14 17:01:39

$.ajaxSetup({cache:false});
$('#myTab li').click(function(){
    var cat_id = $(this).children().attr('rel');
    $.get('location.href' + cat_id, function(data) {
    $('#' + cat_id).html(data);
return false;
});