Twitter Bootstrap Carousel .carousel(number) 不工作答案

【问题标题】：Twitter Bootsrap Carousel .carousel(number) not workingTwitter Bootstrap Carousel .carousel(number) 不工作
【发布时间】：2012-03-04 14:33:29
【问题描述】：

我在使用 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>

有什么线索吗？提前谢谢你。

【问题讨论】：

标签： jquery twitter-bootstrap

【解决方案1】：

数字是从 0 开始的，就像一个数组。试试这个：


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

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

【讨论】：

【解决方案2】：

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

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

【讨论】：

【解决方案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);
});

它可以工作

【讨论】：

【解决方案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);
   });
 });
});

【讨论】：