动态地发送一个WordPress帖子

问题描述：

我一直在试图让这个功能工作很多天，现在这让我疯狂！动态地发送一个WordPress帖子

我在WP中有一个单一的页面主题，其中有一个左边的div，右边是一个帖子列表，右边是一个应该显示点击帖子内容的div。

我发现this question和followed up the linked tutorial并且部分成功。

我设法将这些内容作为参考，并且我只想显示所有内容，但似乎这些任务的顺序是错误的。继承人如何行事：

我点击链接。
当前内容消失。
加载范围出现相反。
同样的内容淡入。
大约1秒后，当前内容被替换为新内容，并且地址栏根本不会改变。

这里是我的代码：

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

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文件（动态内容部分）

<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中（我使用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来执行它们：

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

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

惊人！这很神奇！谢谢你！ – Digger

@GuiHarrison没有问题，容易犯错误（让我花点时间看看：P） – meiamsome

动态地发送一个WordPress帖子

相关推荐