的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 
      }); 
     } 
    );