Jssor非jquery滑块动态量一页多个滑块答案

【问题标题】：Jssor non-jquery slider dynamic amount multiple slider on one pageJssor非jquery滑块动态量一页多个滑块
【发布时间】：2015-05-08 06:15:42
【问题描述】：

如何在单个页面上放置动态量多个滑块？我可以在一个页面上使用 2 个滑块，如下所示：

<script>
jssor_sliderb_starter1 = function (containerId) {
    ...
};
jssor_sliderb_starter2 = function (containerId) {
    ...
};

<div id="sliderb_container1">
...
<script>
    jssor_sliderb_starter1('sliderb_container1');
</script> </div> 

<div id="sliderb_container2">
...
<script>
    jssor_sliderb_starter2('sliderb_container2');
</script> </div>

但是如果我不知道滑块的数量怎么办？请帮忙..

【问题讨论】：

滑块的个数不清楚，那么如何填充html代码呢？

标签： jssor

【解决方案1】：

我在我的页面上添加了 4 个相同的滑块，带有不同的图像和标题，并使用了以下代码，它工作正常。

<!-- Jssor Sliders -->
    <script>
    jssor_sliderb_starter = function (containerId) {
    ...
    };
    </script>


    <!-- Jssor Slider Begin -->
    <div id="sliderb_container1" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container1');
        </script>
    </div>

    <div id="sliderb_container2" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container2');
        </script>
    </div>

    <div id="sliderb_container3" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container3');
        </script>
    </div>

    <div id="sliderb_container4" class="sliderb_con">
        ...
        <script>
            jssor_sliderb_starter('sliderb_container4');
        </script>
    </div>
    <!-- Jssor Slider End -->

所以现在如果我添加更多滑块，我将只需要使用不同的 id。我对如何使用 id 调用函数感到困惑，并认为我必须为每个滑块编写不同的函数。但是代码有效。谢谢你:)

【讨论】：

【解决方案2】：

<!-- Jssor Sliders -->
<script>
   jssor_sliderb_starter = function (containerId) {
   }
</script>

<div id="sliders">
    <!-- Jssor Slider Begin -->
    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>

    <div class="sliderb_con">
    </div>
    <!-- Jssor Slider End -->
</div>

<script>
    var slidersElement = document.getElementById("sliders");
    for (var tmpEl = slidersElement.firstChild; tmpEl; tmpEl =tmpEl.NextSibling) {
        if (tmpEl.nodeType == 1) {
            jssor_sliderb_starter(tmpEl);
        }
    }
</script>

【讨论】：