0

Ok so i have 5 images that when selected shows a load of information on the picture underneath it. 图像和文本存储在自定义联系人类型中。现在我让它处理最后一张图片,这是自定义内容类型中的第一篇文章。我是编写自己的 jQuery 的新手,所以不确定每个循环是否需要某种类型的东西?

这里图像类被赋予了一个ID,所以每个人都是不同的

<a href="#" class="tutorlink-<?php the_id(); ?>"><img src="<?php echo $TutorImageURL[0]; ?>" alt="<?php echo get_post_meta($att, '_wp_attachment_image_alt', true); ?>" /></a>              
<?php endwhile; ?>
<div class="tutor-block">
<img src="<?php bloginfo('template_directory'); ?>/images/click.png" alt="tutors"/>
</div>

<div class="tutor-description">
<?php // The Loop
 while ( $tutors->have_posts() ) : $tutors->the_post(); ?>

这里包含的 div 类也被赋予了自己的 id

<div class="tutor-description-inner-<?php the_id(); ?>">
  <?php the_content(); ?>
</div>

此脚本首先隐藏文本。

<script>
var id = <?php echo $theID; ?>;
$('.tutor-description-inner-'+id+'').hide();
</script>

这是我到目前为止编写的脚本,用于切换最后一张图片的文本。

<script>                  
 $(document).ready(function() {
   $('.tutorlink-'+id+'').click(function() {
     $('.tutor-description-inner-'+id+'').toggle('slow');   
  return false;
    });
});
</script>

请问有什么想法吗?

4

1 回答 1

0

您最好在 id 属性中使用 id,然后将点击事件应用于“tutorlink”类

<a href="#" class="tutorlink" id="<?php the_id(); ?>"><img src="<?php echo $TutorImageURL[0]; ?>" alt="<?php echo get_post_meta($att, '_wp_attachment_image_alt', true); ?>" /></a>

这是描述:

<div class="tutor-description-inner" id="tutor-description-inner-<?php the_id(); ?>">
  <?php the_content(); ?>
</div>

这是点击事件

 <script>                  
     $(document).ready(function() {
       $('.tutorlink').click(function() {
         $('.tutor-description-inner').hide('fast', function() {
            $('#tutor-description-inner-'+this.id+'').toggle('slow');
         });   
      return false;
        });
    });
    </script>
于 2012-11-01T16:49:19.850 回答