Javascript 引导转盘不滑动且不显示文本

Javascript 引导转盘不滑动且不显示文本,javascript,twitter-bootstrap-3,carousel,Javascript,Twitter Bootstrap 3,Carousel,我正试图使用我在bootply上找到的这个小转盘,但我遇到了一些问题。首先,旋转木马不滑动,所以我只能看到第一个图像和幻灯片按钮不工作,第二个是照片附近的文本不可见,可能是因为显示它的javascript函数不工作 这是我的html代码: <div class="row-fluid" style="margin-top:10px; margin-left:10px;"> <div class="span9" id="slider">

我正试图使用我在bootply上找到的这个小转盘,但我遇到了一些问题。首先,旋转木马不滑动,所以我只能看到第一个图像和幻灯片按钮不工作,第二个是照片附近的文本不可见,可能是因为显示它的javascript函数不工作

这是我的html代码:

<div class="row-fluid" style="margin-top:10px; margin-left:10px;">
                  <div class="span9" id="slider">
                    <!-- Top part of the slider -->
                    <div class="row-fluid">
                      <div class="span2" id="carousel-bounding-box">
                        <div id="myCarousel" class="carousel slide">
                          <!-- Carousel items -->
                          <div class="carousel-inner">
                            <div class="active item" data-slide-number="0"><img src="http://lorempixel.com/120/100" style="border-radius:3px"></div>
                            <div class="item" data-slide-number="1"><img src="http://lorempixel.com/120/100/technics/1"style="border-radius:3px"></div>
                            <div class="item" data-slide-number="2"><img src="http://lorempixel.com/120/100/business/1"style="border-radius:3px"></div>
                            <div class="item" data-slide-number="3"><img src="http://lorempixel.com/120/100/city"style="border-radius:3px"></div>
                            <div class="item" data-slide-number="4"><img src="http://lorempixel.com/120/100/city/1"style="border-radius:3px"></div>
                            <div class="item" data-slide-number="5"><img src="http://lorempixel.com/120/100"style="border-radius:3px"></div>
                          </div>

                        </div>

                        <!-- Carousel nav -->
                        <div class="carousel-controls-mini">
                            <a href="#myCarousel" data-slide="prev">‹</a>
                            <a href="#myCarousel" data-slide="next">›</a>
                        </div>

                      </div>

                      <div class="span4" id="carousel-text"></div>
                      <div style="display:none;" id="slide-content">
                        <div id="slide-content-0">
                          <h5>Slide One</h5>
                          <p>This is mini slider / carousel with Bootstrap. Blah blah, blah, blah blah. Lorem dolor?</p>
                          <small>October 13 2013 - <a href="#">Read more</a></small>
                        </div>
                        <div id="slide-content-1">
                          <h5>Slide Two</h5>
                          <p>Mini carousel with Bootstrap</p>
                          <small>October 15 2013 - <a href="#">Read more</a></small>
                        </div>
                        <div id="slide-content-2">
                          <h5>Slider Three</h5>
                          <p>Facebook-style paged image slider</p>
                          <small>October 19 2013 - <a href="#">Read more</a></small>
                        </div>
                        <div id="slide-content-3">
                          <h5>Slider Four</h5>
                          <p>Lorem Ipsum Dolor</p>
                          <small>October 22 2013 - <a href="#">Read more</a></small>
                        </div>
                        <div id="slide-content-4">
                          <h5>Slider Five</h5>
                          <p>Lorem Ipsum Dolor</p>
                          <small>October 25 2013 - <a href="#">Read more</a></small>
                        </div>
                        <div id="slide-content-5">
                          <h5>Slider Six</h5>
                          <p>Lorem Ipsum Dolor</p>
                          <p class="sub-text">October 24 2012 - <a href="#">Read more</a></p>
                        </div>

                      </div>



                    </div>

                  </div>
                </div> <!--/Slider-->

javascript控制台没有返回任何错误,因此我无法理解问题所在。谢谢大家!

您的HTML文件没有检测到jQuery代码

添加以下内容:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

您的HTML文件没有检测到jQuery代码

添加以下内容:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>


您的代码在JSFIDLE中运行良好,除了事件之外,它需要是“slided.bs.carousel”。看,是的,我知道它在小提琴上工作得很好,关键是在我的电脑上它不工作。我尤其感到惊讶的是,文本的javascript函数不起作用。。。它是普通的javascript$('#myCarousel')。on('slided',function(e){不是旋转木马完成滑动时触发的事件。它触发$('#myCarousel')。on('slided.bs.carousel',function(e){你的代码在JSFIDLE中运行良好,除了事件之外,它需要是'slide.bs.carousel'。看,是的,我知道它在FIDLE上运行良好,关键是在我的pc上它不工作。特别是,我很惊讶文本的javascript函数不工作……它是正常的javascript$('#myCarousel')。on('slided',function(e){不是carosel在完成滑动时触发的事件。它在('slided.bs.carousel',function(e)上触发$('myCarousel'){