如何在WordPress Loop中使用jQuery？

Question

如何使用WordPress循環內的jquery不重複效果

<div class="post"> 
     <?php if (have_posts()) : 
     while (have_posts()) : the_post(); ?> 
      <a class="post_image" href="<?php the_permalink(); ?>" > 
       <img class="post_image_home" src='<?php $thumb = get_post_custom_values('post_thumb'); echo $thumb[0]?>' alt="postimg" /> 
      </a><!--post_image--> 
     <?php endwhile; endif; ?></div><!--post--> 

的jQuery：

$j=jQuery.noConflict(); 
    $j('document').ready(function() { 
     $j('.post').hover(function() { 
      $j('.post_image').stop().animate({"margin-bottom":"10px",},"fast"); 
      },function(){ 
      $j('.post_image').stop().animate({"margin-bottom":"0px",},"fast"); 
     });   }); 

Answer 1

你能不能將它添加到一個JS文件？可能會比在PHP文件中使用JS更好，並且每當PHP經過循環時都會阻止它運行。

如果您必須在PHP文件中執行此操作，您可以在循環啓動之前創建一個全局JS變量，並在運行自己的JS/jQuery之前檢查該變量。在循環中的JS內部，更改該全局變量，以便它不會再次運行。

== ==編輯

下面是包括你的主題一個單獨的JS文件的一些示例代碼。

這將是你的functions.php：

add_action('wp_enqueue_scripts', 'front_end_js_files'); 
function front_end_js_files(){ 
    // shouldn't be needed, but to be safe 
    wp_enqueue_script('jquery'); 
    // this is looking in the same dir as your functions.php 
    wp_enqueue_script('my_own_file', get_bloginfo('template_url') . 'my_own_file.js'); 
} 

然後在my_own_file.js，粘貼您的jQuery。請注意，您的JS現在將被包含在每個頁面中，所以您可能想讓jQuery選擇器更具體。或者，在排入腳本之前，在PHP中添加一些自定義頁面檢測。