通过将jquery滑块绑定到ajax加载的图像，在同一页面上有多个滑块

Question

需要一些Jquery帮助。

我想在我的页面上使用http://www.basic-slider.com/。我有无限滚动，增加了新的图像。有些是一组图像，所以我想为这些集添加一个滑块。它看起来像这样。

<ul class="images">
   <li id="1">  <img1>
                <img2>
                <img3> </li>
   <li id="2"> 
                <img1></li>
   <li id="3">
                <img2>
                <img3> </li>
.
.
<ul>

无限加载会通过ajax向<li>添加更多.images。我可以进行html更改，例如将图像放入另一个<ul>但不确定如何更改jquery代码。

请帮忙。

Answer 1

好的，你可以这样做。

var imageBlock = 0; //THIS IS GLOBAL

然后创建一个初始化滑块插件的函数

function initializeSlider(imageBlock){
    $('#images' + imageBlock).bjqs({
      'height' : 320,
      'width' : 620,
      'responsive' : true
    });
 }

然后滚动，如果closeToBottom

if(closeToBottom){
  imageBlock = imageBlock + 1;
  initializeSlider(imageBlock);
}

您也可以在页面加载时执行相同操作。

注意：使用递增索引添加您创建的ul元素。