Question

我在Twitter Bootstrap Carousel插件上遇到.carousel(number)方法的问题。不知怎的，我无法让它发挥作用。轮播本身已启动并运行，.carousel('next')方法也是如此。

$('#carousel-nav a').click(function(q){
 q.preventDefault();
 targetSlide = $(this).attr('data-to');
 //this one doesn't work $('#my-carousel').carousel(targetSlide); 
 $('#my-carousel').carousel('next');
});

这是标记

<ul id="carousel-nav" class="nav nav-tabs nav-stacked">
    <li><a href="#my-carousel" data-to="0" >Slide 1</a></li>
    <li><a href="#my-carousel" data-to="1" >Slide 2</a></li>
    <li><a href="#my-carousel" data-to="2" >Slide 3</a></li>
</ul>

有任何线索吗？提前谢谢。

Answer 1

数字为0，类似于数组。试试这个：


    var targetSlide = $(this).attr('data-to') -1;

我刚从你的targetSlide变量中减去1。它对我有用。

Answer 2

真正的问题是你必须解析为int

targetSlide = parseInt($(this).attr('data-to'));

Answer 3

将标记更改为：

<ul id="carousel-nav" class="nav nav-tabs nav-stacked">
    <li><a href="#my-carousel" data-to="1" >Slide 1</a></li>
    <li><a href="#my-carousel" data-to="2" >Slide 2</a></li>
    <li><a href="#my-carousel" data-to="3" >Slide 3</a></li>
</ul>

和脚本（感谢@ user1209713）：

$('#carousel-nav a').click(function(q){
    q.preventDefault();
    targetSlide = $(this).attr('data-to')-1;
    $('#my-carousel').carousel(targetSlide);
});

并且有效

Answer 4

parseInt为我工作谢谢@stalin，如果你想要运行动作，在回调中单独执行它们以获得更好的结果。

$('#carousel-nav a').click(function(){
 var targetSlide = parseInt($(this).attr('data-cigar'));
 $('#someElement').fadeOut('fast',function(){
   $('#otherElement').fadeIn('fast', function(){
     $('#my-carousel').carousel(targetSlide);
   });
 });
});

Twitter Bootstrap Carousel .carousel（号码）无效

4 个答案: