将时间线添加到 Bootstrap Carousel答案

【问题标题】：Add timeline to Bootstrap Carousel将时间线添加到 Bootstrap Carousel
【发布时间】：2015-03-04 21:15:36
【问题描述】：

我想知道是否有办法将脚本添加到 Bootstrap 的轮播中，这样它就会在时间轴内显示图像。比如说，我希望在 3 月 5 日和 3 月 11 日之间显示图像，图像应该消失。我已经能够使用其他幻灯片来执行此操作，例如 pikachoose，但我无法使用 Bootstrap 的轮播来执行此操作。

我之前用过的脚本就是这个

        $(document).ready(
            function (){

                //Users time
                var timeLocal = new Date();

                var AllImages = $(".item");

                var liEndDate;
                var imgEndDate;

                var liStartDate;
                var imgStartDate;

                var thisImg;

                for (var i = 0; i < AllImages.length; i++) {

                    thisImg = AllImages[i];

                    liEndDate = thisImg.getAttribute("endDate");
                    imgEndDate = new Date(liEndDate);

                    liStartDate = thisImg.getAttribute("startDate");
                    imgStartDate = new Date(liStartDate);

                    if (imgStartDate > timeLocal || imgEndDate < timeLocal || liEndDate == null || liStartDate == null ) { // si timeLocal es menor a TheNext, entonces haga esto.\

                        //document.write(AllImages[i].outerHTML);
                        $(thisImg).remove();

                    } else {

                        $(thisImg).show();
                    }

                });

    </script>

但我无法让它适应轮播谢谢。

【问题讨论】：

标签： javascript html twitter-bootstrap carousel

【解决方案1】：

我能够更改代码并使其工作。但是，这会在应该隐藏图像的那一刻隐藏整个幻灯片。

<script language="javascript">
        $(document).ready(
                function () {

                    //Users time
                    var timeLocal = new Date();

                    var AllImages = $(".item img");

                    var liEndDate;
                    var imgEndDate;

                    var liStartDate;
                    var imgStartDate;

                    var thisImg;

                    for (var i = 0; i < AllImages.length; i++) {

                        thisImg = AllImages[i];

                        liEndDate = thisImg.getAttribute("endDate");
                        imgEndDate = new Date(liEndDate);

                        liStartDate = thisImg.getAttribute("startDate");
                        imgStartDate = new Date(liStartDate);

                        if (imgStartDate > timeLocal || imgEndDate < timeLocal || liEndDate === null || liStartDate === null) { // si timeLocal es menor a TheNext, entonces haga esto.\

                            //document.write(AllImages[i].outerHTML);
                            $(thisImg).remove();

                        } else {

                            $(thisImg).show();
                        }

                    }
                });

    </script>

【讨论】：