Javascript 引导转盘'；s活动项目问题

我正在努力学习有关引导的旋转木马的基础上。 但是当我试着做一个模拟的时候。但它不能作为它的演示。 当用户单击另一个

时，活动项无法更改。我试过了，但还是不明白为什么。 这是我的HTML：

<div class="container">
  <div id="myCarousel" class="carousel slide" data-ride="carousel">

    <ul class="nav nav-pills nav-justified">
      <li data-target="#myCarousel" data-slide-to="0" class="active"><a href="#">About<small>Lorem ipsum dolor sit</small></a></li>
      <li data-target="#myCarousel" data-slide-to="1"><a href="#">Projects<small>Lorem ipsum dolor sit</small></a></li>
      <li data-target="#myCarousel" data-slide-to="2"><a href="#">Portfolio<small>Lorem ipsum dolor sit</small></a></li>
    </ul>

    <!-- Wrapper for slides -->
    <div class="carousel-inner">
      <div class="item active">
        <img src="http://placehold.it/1200x400/cccccc/ffffff" />
      </div>
      <!-- End Item -->

      <div class="item">
        <img src="http://placehold.it/1200x400/999999/cccccc">
      </div>
      <!-- End Item -->

      <div class="item">
        <img src="http://placehold.it/1200x400/dddddd/333333">
      </div>
      <!-- End Item -->
    </div>
    <!-- End Carousel Inner -->

  </div>
</div>

谁能告诉我怎么了？我还是这个jquery的新手。 在他的演示中，他为什么这样使用：

$('#myCarousel').on('click', '.nav a', function() {...});

我想我们只能使用：

$('#myCarousel').on('click',function(){...});

这就是我从中学到的

---

这是我的

您试图将class.nav设置为具有#myCarousel的元素作为目标，但您的类位于该id之下。因此，为了将锚定标记作为目标，您必须告诉

#myCarousel

在选择器之间放置空格，找到class

.nav

的子元素

改变这个

  $('#myCarousel.nav a')

到

---

对于您的选择问题，请勾选此问题

您试图将class.nav设置为具有

#myCarousel

的元素，但是您的类位于该id之下。因此，为了定位锚定标记，您必须告诉

#myCarousel

在选择器之间留出空格，找到class

.nav

的孩子

改变这个

  $('#myCarousel.nav a')

到

---

对于您的选择问题，请检查此问题。

您好，我尝试了相同的js并创建了此它对我来说运行良好

请检查一下，让我知道

$(document).ready( function() {
    $('#myCarousel').carousel({
   interval:   4000
    });

    var clickEvent = false;
    $('#myCarousel').on('click', '.nav a', function() {
            clickEvent = true;
            $('.nav li').removeClass('active');
            $(this).parent().addClass('active');        
    }).on('slid.bs.carousel', function(e) {
        if(!clickEvent) {
            var count = $('.nav').children().length -1;
            var current = $('.nav li.active');
            current.removeClass('active').next().addClass('active');
            var id = parseInt(current.data('slide-to'));
            if(count == id) {
                $('.nav li').first().addClass('active');    
            }
        }
        clickEvent = false;
    });
});

---

您好，我尝试了相同的js并创建了这个它对我来说很好

请检查一下，让我知道

$(document).ready( function() {
    $('#myCarousel').carousel({
   interval:   4000
    });

    var clickEvent = false;
    $('#myCarousel').on('click', '.nav a', function() {
            clickEvent = true;
            $('.nav li').removeClass('active');
            $(this).parent().addClass('active');        
    }).on('slid.bs.carousel', function(e) {
        if(!clickEvent) {
            var count = $('.nav').children().length -1;
            var current = $('.nav li.active');
            current.removeClass('active').next().addClass('active');
            var id = parseInt(current.data('slide-to'));
            if(count == id) {
                $('.nav li').first().addClass('active');    
            }
        }
        clickEvent = false;
    });
});

---

我按照我的建议改变了。但仍然无法更改carouselCheck out fiddle的活动项。我也复制了您的代码。但我不会工作。我不知道为什么。它仍然无法更改活动项，活动滑块仍然运行良好。可能在jquery版本中有所不同，请使用

jquery-3.1.1.min.js

和bootstrap 3.3.7检查outusing。你用的是哪个版本？？？我按照我的建议改了。但仍然无法更改carouselCheck out fiddle的活动项。我也复制了您的代码。但我不会工作。我不知道为什么。它仍然无法更改活动项，活动滑块仍然运行良好。可能在jquery版本中有所不同，请使用

jquery-3.1.1.min.js

和bootstrap 3.3.7检查outusing。你使用了哪个版本？？？我忘了添加我的自定义

js

。很抱歉，谢谢大家的帮助。我忘记添加我的自定义

js

。对不起，谢谢大家的帮助。