0

我在特定 div 的页面中为同一类别的不同帖子显示了精选图像。我需要在另一个 div 的同一页面中显示与此图像相关的整个帖子。我知道我必须在此使用 JavaScript。但我需要一些可以用于此的参考。谁能帮我这个?我正在使用以下代码来显示图像

<?php
/*
Template Name: Meet The Team Template
*/
?>
<?php get_header(); ?>
<div id = "meet_posts" class = "narrowcolumn">
<?php 
     $recent = new WP_Query("cat=6&orderby=title&order=ASC"); 
     while( $recent->have_posts() ) : $recent->the_post();
     $desc_values = get_post_custom_values("description");

?>
<div id="meetteam_featured_image">
     <a href="<?php the_permalink() ?>" rel="title">
     <?php
          if ( has_post_thumbnail() ) {
              the_post_thumbnail();
          }
     ?>
     </a>
</div>
<?php endwhile; ?>
</div>
<?php get_footer(); ?>

提前致谢。

4

2 回答 2

1

用以下代码替换上面的代码:

<?php /*
Template Name: Meet The Team Template
*/
?>
<?php get_header(); ?>
<div id="meet_posts" class="narrowcolumn">
<?php 
$recent = new WP_Query("cat=6&orderby=title&order=ASC"); 
while($recent->have_posts()):$recent->the_post();
$desc_values = get_post_custom_values("description");

?>
<div id="meetteam_featured_image" class="<?php the_ID(); ?>">
<a href="<?php the_permalink() ?>" rel="title">
 <?php
if ( has_post_thumbnail() )  { 
        the_post_thumbnail();
    }
?>
</a>
</div>
<?php endwhile ?>
<div id="image-post-info"></div>
</div>

<?php get_footer(); ?>

在 functions.php 文件中添加以下代码:

add_action( 'wp_ajax_ajaxified_function', 'ajaxified_function' );
add_action( 'wp_ajax_nopriv_ajaxified_function', 'ajaxified_function' );
function ajaxified_function() {   
$temp = get_post($_POST['post_id']);
echo $temp->post_title.'<br/><br/>'.$temp->post_content;   
die();
}   

在您的自定义 js 文件中添加以下代码:

jQuery(document).ready(function (){       

 jQuery('#meetteam_featured_image a').on('click',function(event){         
 event.preventDefault();

 var post_id = jQuery(this).parent().attr('class');            
 jQuery.ajax({  
   type: "POST",                  
   url:  'http://www.yoursitename.com/wp-admin/admin-ajax.php',  
   data: 'action=ajaxified_function&post_id='+post_id,    
   success: function (msg) {                                        
      jQuery('#image-post-info').html(msg);
  },
  error: function () {                  
    alert('Error');                    
   }  
    });           
  });       
});

通过在 functions.php 文件中包含以下代码来添加自定义 js 文件:

function add_custom_scripts() {
wp_enqueue_script( 'custom-scripts',  get_stylesheet_directory_uri() .'/js/custom-     scripts.js' );
}
add_action( 'wp_enqueue_scripts', 'add_custom_scripts' );

希望这会有所帮助....!!!!!!

于 2013-02-28T09:24:14.553 回答
-1
<div id = "meet_posts" class = "narrowcolumn">
<?php 
     $recent = new WP_Query("cat=6&orderby=title&order=ASC"); 
     while( $recent->have_posts() ) : $recent->the_post();
     $desc_values = get_post_custom_values("description");

?>  
</div><!--close first div-->

<div id="meetteam_featured_image">
     <a href="<?php the_permalink() ?>" rel="title">
     <?php
          if ( has_post_thumbnail() ) {
              the_post_thumbnail();
          }
     ?>
     </a>
</div><!--close second div-->
<?php endwhile; ?>
于 2013-02-28T07:57:36.947 回答