动态地将一个Word preSS后 [英] Bring a WordPress post dynamically

问题描述

我一直在努力使很多天此功能工作，现在，它的驾驶我坚果！

I've been trying to make this feature work for many days now and it's driving me nuts!

我有一个单页主题可湿性粉剂并在其中一人有左侧用在站点和右侧的职位名单，这应该显示的点击帖子的内容一个div一个div。

I have a single page theme in WP and in one of them there is a div on the left with a list of the posts in the site and on the right, a div that should display the content of the clicked post.

我发现这个问题和<一href="http://net.tutsplus.com/tutorials/javascript-ajax/how-to-load-in-and-animate-content-with-jquery/"相对=nofollow>跟进链接的教程和部分成功。

我设法使内容dinamically，以及所有我想要显示的，但它似乎的任务的顺序是错误的。继承人它是如何作用：

I managed to bring the content dinamically, and all I want is being displayed but it seems the order of the tasks are wrong. Heres how it's acting:

1. 我点击的链接。
2. 在当前内容消失。
3. 装载跨度出现correctely。
4. 同样的内容淡入
5. 后1秒左右的当前内容被替换为新的内容和地址栏不改变的。

这里的code，我有：

Here's the code I have:

• atracoes.js $（文件）。就绪（函数（）{

• atracoes.js $(document).ready(function() {

var hash = window.location.hash.substr(1);
var href = $('.controle nav li a').each(function(){
    var href = $(this).attr('href');
    if(hash==href.substr(0,href)){
        var aCarregar = hash+'.html #atr-conteudo';
        $('#atr-conteudo').load(aCarregar)
    }
});

$('.controle nav li a').click(function() {

    var aCarregar = $(this).attr('href')+' #atr-conteudo';
    $('#atr-conteudo').hide('fast',carregarConteudo);
    $('#carregando').remove();
    $('#atracoes').append('<span id="carregando">Carregando...</span>');
    $('#carregando').fadeIn('normal');

    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href'));

    function carregarConteudo () {
        $('#atr-conteudo').load(aCarregar,'',mostrarNovoConteudo());
    }
    function mostrarNovoConteudo () {
        $('#atr-conteudo').show('normal',esconderCarregando());
    }
    function esconderCarregando () {
        $('#carregando').fadeOut('normal');
    }

    return false;
    });
    });

index.php文件（动态内容的一部分）

index.php (the dynamic content part)

<div class="main" id="atracoes">

    <div class="controle">

        <nav>
        <?php
        $args = array( 'posts_per_page' => 20);

        $myposts = get_posts( $args );
        foreach ( $myposts as $post ) : setup_postdata( $post ); ?>
            <li>
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </li>
        <?php endforeach; 
        wp_reset_postdata();?>
        </nav>

    </div>

    <div id="atr-conteudo">

        <?php the_post_thumbnail(); ?>
        <div id="atr-texto">
            <h2><?php the_title(); ?></h2>
            <?php the_content(); ?>
        </div>

    </div>

</div>

• 的single.php（部分我采摘与阿贾克斯）
• single.php (the part I'm plucking with ajax)

<!-- article -->
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

    <!-- post thumbnail -->
    <?php if ( has_post_thumbnail()) : // Check if Thumbnail exists ?>
        <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
            <?php the_post_thumbnail(); // Fullsize image for the single post ?>
        </a>
    <?php endif; ?>
    <!-- /post thumbnail -->


    <div id="atr-texto">
    <!-- post title -->
    <h1>
        <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
    </h1>
    <!-- /post title -->

    <?php the_content(); // Dynamic Content ?>

    <?php edit_post_link(); // Always handy to have Edit Post Links available ?>
    </div>
</article>

             

    

推荐答案

您正在呼叫的功能的 的，你把它们传递，而不是让jQuery来执行它们之前，jQuery的执行，：

You're calling the functions before you pass them to jQuery to execute, instead of allowing jQuery to execute them:

function carregarConteudo () {
    $('#atr-conteudo').load(aCarregar,'',mostrarNovoConteudo);
}
function mostrarNovoConteudo () {
    $('#atr-conteudo').show('normal',esconderCarregando);
}

（注意：他们不再有（）函数名后）

这篇关于动态地将一个Word preSS后的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！