0

我需要稍微修改一下 Bootstrap 滑块。

现在我有以下 HTML 代码以及 jQuery：

            <div id="carousel-slider2" class="carousel slide bs-docs-carousel-example">
                <ol class="carousel-indicators">
                    <li class="rooms active" data-target="#carousel-slider2" data-slide-to="0"></li>
                    <li class="rooms" data-target="#carousel-slider2" data-slide-to="1"></li>
                    <li class="rooms" data-target="#carousel-slider2" data-slide-to="2"></li>
                    <li class="rooms" data-target="#carousel-slider2" data-slide-to="3"></li>
                    <li class="rooms" data-target="#carousel-slider2" data-slide-to="4"></li>

                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="5"></li>
                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="6"></li>
                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="7"></li>
                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="8"></li>
                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="9"></li>
                    <li class="ambience" data-target="#carousel-slider2" data-slide-to="10"></li>

                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="11"></li>
                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="12"></li>
                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="13"></li>
                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="14"></li>
                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="15"></li>
                    <li class="holmen" data-target="#carousel-slider2" data-slide-to="16"></li>
                </ol>

jQuery：

$('#carousel-slider2').on('slide.bs.carousel', function() {
    console.log($("#carousel-slider2").children(".carousel-indicators").children("li"));
}

到目前为止，这有效，不是问题，我从 . 但我只想要具有“活动”类的那个。但由于某种原因，没有任何效果，不是原生 JS 方法“.getElementsByClassName”，也不是我知道的任何 jQuery 方法。有什么解决办法吗？

4

2 回答 2

0

使用.find()方法，因为它允许在 DOM 树中搜索元素的后代，而.children()方法仅在 DOM 树中向下移动一层。 

$(document).ready(function(){
$('#carousel-slider2').on('slid.bs.carousel', function() { //you havent specified any event
var $li = $("#carousel-slider2").find(".carousel-indicators li.active");
}); //here you made an error in your code

});

于 2013-10-25T06:41:30.030 回答
0

你可以这样做：

// Get the li element with the active class
var $li = $("#carousel-slider2").children(".carousel-indicators").children("li.active");

或者，

var $li = $("#carousel-slider2 > .carousel-indicators > li.active");
于 2013-10-25T06:34:20.847 回答