的Jquery的fancybox联内容显示不同的div的内容

Question

jQuery代码

$("a#inline").fancybox({ 
     'type' : 'inline', 
     'hideOnContentClick': true 
    }); 

HTML代码

<div class="top_wrap"> 
<div class="top_header">Testimonial</div> 
<div class="top_text"> 

<?php 
if($getClientTestimonial->num_rows()>0){ 
    //$result = $profile->row(); 
    foreach ($getClientTestimonial->result()as $row){ 
    $clientName= $row->testimonialClientName; 
    $clientTestiContent= $row->testimonialContent; 
    //$length =10; 
    $displaytype= substr($clientTestiContent,0,50); 
?> 

<strong><?php echo $clientName;?></strong> 

<a id="inline" href="#data"><?php print_r($displaytype) ;?></a><br> 
      <div style="display:none"><div class="data" id="data"><?php echo $clientTestiContent;?></div></div> 

<?php }}?> 

</div> 
</div> 

的问题是，它显示不同#DATA的内容......类似的东西展示内容1,2,3,4 ....如果我点击4它显示1格的内容？接下来，如果我点击1它显示2格的内容？

的

content is 
1 div content 
2 div content 
3 div content 
4 div content 

的onclick 4格内容显示1个格内容的内容，但应该显示4格内容的内容

如何克服这个问题

Answer 1

创建4个不同的锚标签，给其中一类，

<a id="inline1" href="#data1" class='fancybox-anchor-tag'><?php print_r($displaytype) ;?></a><br> 
<div style="display:none"><div class="data" id="data1"><?php echo $clientTestiContent;?></div></div> 
<a id="inline2" href="#data2" class='fancybox-anchor-tag'><?php print_r($displaytype) ;?></a><br> 
<div style="display:none"><div class="data" id="data2"><?php echo $clientTestiContent;?></div></div> 
<a id="inline3" href="#data3" class='fancybox-anchor-tag'><?php print_r($displaytype) ;?></a><br> 
<div style="display:none"><div class="data" id="data3"><?php echo $clientTestiContent;?></div></div> 
<a id="inline4" href="#data4" class='fancybox-anchor-tag'><?php print_r($displaytype) ;?></a><br> 
<div style="display:none"><div class="data" id="data4"><?php echo $clientTestiContent;?></div></div> 

编辑：

在你的PHP代码，这样做：

<?php 
if($getClientTestimonial->num_rows()>0){ 
$i = 1; 
    //$result = $profile->row(); 
    foreach ($getClientTestimonial->result()as $row){ 
    $clientName= $row->testimonialClientName; 
    $clientTestiContent= $row->testimonialContent; 
    //$length =10; 
    $displaytype= substr($clientTestiContent,0,50); 
?> 

<strong><?php echo $clientName;?></strong> 

<a id="inline<?php echo $i; ?>" href="#data<?php echo $i; ?>" class="fancybox-anchor-tag"><?php print_r($displaytype) ;?></a><br> 
      <div style="display:none"><div class="data" id="data<?php echo $i; ?>"><?php echo $clientTestiContent;?></div></div> 

<?php 
$i++; 
}}?> 

然后做到这一点：

$('a.fancybox-anchor-tag') 
    .each(
     function (e) 
     {    
      $(this).fancybox({ 
       'type' : 'inline', 
       'hideOnContentClick': true 
      }); 
     } 
    );