它沒有顯示所有圖像

在我使用的是基本的jQuery的滑塊，頁面演示是在這裏：page info

現在我遇到的問題是，它的顯示器問題1中的圖像，但不是問題2中的圖像。現在，在我包含滑塊之前，它會在所有問題中顯示圖像。但是因爲我包含滑塊，所以它只在第一個問題中顯示圖像。我怎樣才能讓圖像在所有問題中顯示？

CODE：

<form action='results.php' method='post' id='exam'> 

<?php 

foreach ($arrQuestionId as $key=>$question) { 

?> 

<div class='lt-container'> 
<p><?php echo htmlspecialchars($arrQuestionNo[$key]) . ": " . htmlspecialchars($arrQuestionContent[$key]); ?></p> 

<?php 

       //start:procedure image 
     $img_result = ''; 
     if(empty($arrImageFile[$key])){ 
      $img_result = '&nbsp;'; 
     }else{ 

?> 

<div id="banner-slide"> 
<ul class="bjqs"> 
<?php foreach ($arrImageFile[$key] as $i) { ?> 
<li><img alt="<?php echo $i; ?>" height="200" width="200" src="<?php echo 'ImageFiles/'.$i; ?>"></li> 
<?php } ?> 
</ul> 
</div> 

     <script type="text/javascript"> 

jQuery(document).ready(function($) { 

     $('#banner-slide').bjqs({ 
      animtype  : 'slide', 
      height  : 200, 
      width   : 200, 
      responsive : true, 
      randomstart : true 
      }); 
      }); 

      </script> 

<?php 

     } 
     //end:procedure image 
?> 

</div> 


<?php 

} 

?> 
</form>

來源

2013-02-10 user2048994

你有相同的ID在頁面上兩個div。＃1，這是一個沒有壞的HTML。您將需要獨立地在每個div上啓動滑塊。

$('#banner-slide1').bjqs({ //ETC 

$('#banner-slide2').bjqs({ //ETC

這足以瞭解你出錯的原因以及爲什麼它不起作用。 JQuery不知道要使用哪個橫幅幻燈片，或者實際上只使用第一個幻燈片，因爲它知道每個頁面應該只有一個ID。

我不知道你的滑塊插件是如何工作的，但你可以到IDS改爲班的div，然後啓動滑蓋：

$('.banner-slide').bjqs({ //ETC

$('.banner-slide').each(function(){ 
    $(this).bjqs({ //ETC

這取決於插件的工作方式。

來源

2013-02-10 00:57:15 Leeish

最佳答案，你在第一個代碼片段中提到的是應該做什麼 – user2048994 2013-02-10 01:10:40

元素ID對於單個元素應該是唯一的。你不能給兩個元素使用相同的ID。嘗試將ID更改爲banner-slide1和banner-slide2。

來源

2013-02-10 00:57:45 jungos

它沒有顯示所有圖像

回答

相關問題