它没有显示所有图像

在我使用的是基本的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

它没有显示所有图像

回答

相关问题