繁体   English   中英

jQuery append和Bootstrap轮播

[英]JQuery append and Bootstrap carousel

所以我想使用JQuery添加自定义数量的轮播项目。

这是script.js中的代码(这也是文件中唯一的代码)。

<script>
$(document).ready(function(){
    for(i = 0; i < 5; i++) {
        $('.carousel-inner').append('<div class="item"> <img src="1.jpg" alt=""> </div>');
    }
});</script>

那就是我所谓的脚本

<script type="text/javascript" src="script.js"></script>

这是已经包含两项的轮播:

<div class="carousel-inner" role="listbox">
        <div class="item active">
        <img src="1.jpg" alt="">
        <div class="carousel-caption">
        <h3>Item 1</h3>
        <p>This is the first item</p>
        </div>
        </div>

        <div class="item">
            <img src="5.jpg" alt="">
            <div class="carousel-caption">
                <h3>Item 2</h3>
                <p>This is the second item</p>
            </div>
        </div>
</div>

但是,我在轮播中看不到任何其他项目,因此无法正常工作。

好吧,如果有人挣扎,我犯了一个愚蠢的错误,这就是答案:

$('.carousel-indicators').append('<li data-target="#myCarousel" data-slide-to="'+ i + '"></li>');

只需将其添加到script.js中即可。 问题是我实际上创建了项目,但没有显示它们,因为我还需要为项目添加指示器。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM