Question

我使用此脚本滑块： http://www.bootply.com/79859 当图像数量超过9时出现问题。

缩略图编号10重定向到幻灯片0

11号滑1

12号滑动2 ...

此代码有什么问题？

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

// handles the carousel thumbnails
$('[id^=carousel-selector-]').click( function(){
  var id_selector = $(this).attr("id");
  var id = id_selector.substr(id_selector.length -1);
  id = parseInt(id);
  $('#myCarousel').carousel(id);
  $('[id^=carousel-selector-]').removeClass('selected');
  $(this).addClass('selected');
});

// when the carousel slides, auto update
$('#myCarousel').on('slid', function (e) {
  var id = $('.item.active').data('slide-number');
  id = parseInt(id);
  $('[id^=carousel-selector-]').removeClass('selected');
  $('[id=carousel-selector-'+id+']').addClass('selected');
});

Answer 1

问题在于这一行：

var id = id_selector.substr(id_selector.length -1);

假设数字的长度是1个字符长。改为将其更改为此。此版本在最后一个-的位置之后开始：

var id = id_selector.substr(id_selector.lastIndexOf("-")+1);

Bootstrap轮播，缩略图超过9项

1 个答案: