2013-04-12 32 views
2

嗨我已經在這裏經歷了很多教程和問題,但主題似乎還不清楚。在wordpress中動態加載ajax的帖子

這是我能找到的5-tips-for-using-ajax

我已經顯示我的自定義後的縮略圖在網格中我的索引頁上最好的教程。 我試圖創建一個點擊事件加載鏈接的帖子通過ajax到同一頁面上的div而不是轉到帖子。我見過這種方法在很多網站上使用,但無法找到正確的教程/方法來做到這一點。

這裏有一些例子: Revealawaregarnishying+yang

希望有人能澄清這2周下了線我在主題:(

腳本我不是更清晰使用至今。

<ul id="og-grid" class="og-grid"> 
      <?php query_posts(array('post_type' => array('portfolio')));?><?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
      <li><a class="ajax-click" href="#" ><?php the_post_thumbnail('thumbnail', array('class' => 'thumb', 'alt' => ''.get_the_title().'', 'title' => ''.get_the_title().'')); ?></a></li><?php endwhile; ?><?php endif; ?> 
     </ul> 
    </div> 

的index.php

wp_register_script('loadajax', get_stylesheet_directory_uri() . '/library/js/loadajax.js', array('grid-js'), false , true); 
wp_localize_script('loadgrid', 'MyAjax', array('ajaxurl' => admin_url('admin-ajax.php'))); 

註冊我的劇本和管理的Ajax

add_action ('wp_ajax_nopriv_cmdv_load', 'cmdv_load_ajax'); 
add_action('wp_ajax_cmdv_load_ajax', 'cmdv_load_ajax'); 

function cmdv_load_ajax() { 

$the_slug = $_POST['slug']; 
$args=array(
    'name' => $the_slug, 
    'post_type' => 'projects', 
    'post_status' => 'publish', 
    'showposts' => 1, 
); 
$my_posts = get_posts($args); 
if($my_posts) : 

    global $post; 
    $post = $my_posts[0];  

    // generate the response 
    $response = json_encode("Success"); 

    // response output 
    header("Content-Type: application/json");  
    ?> 

    <div id="ajax-project-<?php the_ID(); ?>" <?php post_class('project main ajax clearfix'); ?> > 

     <div class="projectHeader"> 
      <h1><?php the_title(); ?></h1> 

      <div class="projectNav clearfix">     
       <?php 

       $prev_post = get_previous_post(); 
       if($prev_post) $prev_slug = $prev_post->post_name; 
       $next_post = get_next_post(); 
       if($next_post) $next_slug = $next_post->post_name; 
       ?>     
       <div class="next <?php if(!$next_slug) echo 'inactive';?>"> 
        <?php if(isset($next_slug)) : ?> 
         <a href="#<?php echo $next_slug;?>" onClick="nextPrevProject('<?php echo $next_slug;?>');">Next</a> 
        <?php endif; ?> 
       </div> 
       <div class="previous <?php if(!$prev_slug) echo 'inactive';?>"> 
        <?php if(isset($prev_slug)) : ?> 
         <a href="#<?php echo $prev_slug;?>" onClick="nextPrevProject('<?php echo $prev_slug;?>');">Previous</a> 
        <?php endif; ?> 
       </div> 
       <div class="closeBtn"> 
        <a href="#index">Close Project</a> 
       </div>    
      </div> 
     </div> 
    <div class="entry"> 
     <?php the_content(); ?> 
    </div> 
</div> 
<?php endif; ?> 
<?php die();?> 
<?php } ?> 

function.php

jQuery的就是我真的很掙扎,所以這是我需要的方向!我使用thumbnail grid with expanding preview對準縮略圖,但增加的點擊功能和響應我只是不能工作了:(

感謝

+1

您必須發佈一些代碼才能獲得回覆 –

+0

是的,您正在嘗試的真實生活樣本會爲您提供具體問題的具體解決方案,否則您將被指向[其他教程](http ://stackoverflow.com/a/13614297/1287812)。 – brasofilo

+0

謝謝你們,我會用一些代碼對它進行編輯,使它更加清楚我在哪裏掙扎。 – cmdv

回答

3

最好的方法是使用內置的AJAX。換句話說,發送您的AJAX請求wp-admin/admin-ajax.php。你的PHP函數應該在functions.php被inclueded。

對於一個初學者,我承認這不是一件容易的問題,但也有關於這個網絡上的許多TUTOS。

這是一個教程我已經寫過關於SO的Wordpress AJAX:

Dynamically changing navigation links (next and previous) in Wordpress via AJAX

注:因爲它包含了我所用的老辦法不讀書的問題,閱讀的答案包含正確的做法。

+0

謝謝我會查看你所附的鏈接。我還爲這個問題添加了一些代碼,以便讓我更加了解當前的情況 – cmdv

相關問題