获取JCarousel中当前项的索引
我试图获取JCarousel中当前项的索引，以便我可以在Carousel中向用户显示当前位置。 例如，’13 / 20’。
我怎样才能做到这一点？
编辑：
最终产品样本：
我认为您正在寻找的是carousel.first，它将为您提供第一个可见元素的索引（还有carousel.last来显示最后一个可见元素）。
下面是一个使用它的示例，基于简单的轮播示例，添加了carousel.first变量和itemLoadCallback事件：
jCarousel
Riding carousels with jQuery
Simple carousel
This is the most simple usage of the carousel with no configuration options.
Current Photo 1 您可以使用：
function trigger(carousel, state) { index = carousel.index(carousel.last, size of list); }
它看起来并不像我希望从jQuery插件那样诚实。 有两个回调项itemVisibleInCallback和itemVisibleOutCallback ，但如果你一次只显示一个图像，它们将会很有用。
老实说，尽管我讨厌让你走上一条完全不同的道路，我强烈建议使用循环插件进行轮播工作，因为它允许我通过jCarousel快速查看的更多更精细的定制（对不起jCarousel作者 – 代码本身看起来很棒！）。
我也发现jCarousel在你需要的时候返回不可用的.first，.last，.prevFirst和.prevLast属性。
因此，我必须以脏方式执行它并决定编写一个函数，通过读取它的左偏移量是否大于零，返回容器中当前第一个li标签的ID。 如果是这样，并且它是第一个左上位置为零的，那就是我当前的幻灯片。
以下代码假定您在foreach（）循环中的list标记中放置了id =“listitem-N”，其中N是当前迭代。
var currSlide = 0; function getCurrentCarouselItem(){ $("ul#use-cases li.use-case").each(function(){ var leftPos = $(this).offset().left; if( leftPos >= 0){ var id = $(this).attr('id').split("-"); currSlide = id[1]; return false; } }); return currSlide; }
我没有在each（）中返回id的原因是因为each（）是一个函数，返回只返回该函数，而不是getCurrentCarouselItem（）。
取决于你想要做什么，但这里是一个更“通用的方式”来做同样的事情，而不是你返回对象本身而不是id：
var currSlide = 0; function getCurrentCarouselItem(){ $("ul#ulcol li.licol").each(function(){ if ($(this).offset().left >= 0){ currSlide = this; return false; } }); return currSlide; }
我发现这种突出显示可能包含答案的jcarousel控制器的方法。
您可以挂钩’jcarousel：animate’事件，并将当前幻灯片作为jQuery对象获取。
$('#mycarousel').on('jcarousel:animate', function(event, carousel) { console.log(carousel._target); // this outputs your current slide as jQuery object. });
如果你有分页（子弹）
你可以简单地使用：
var index = $('.active').html();
jcarousel正在将类’active’添加到活动项目符号中，如果你在项目符号上有数字，你只需通过.html（）方法检索它们
您也可以通过parseInt将它们转换为整数：
var index = parseInt($('.active').html());
如果您的轮播中的项目可以重新订购，我发现获得当前项目索引的唯一可靠方法是：
$('#myCarousel').on('jcarousel:visiblein', 'li', function(event, carousel) { var index = $('#'+this.id).index(); console.log('++ index: %s', index); });
这就是原因。
您会注意到轮播中每个项目的this.id类似于image-1 ，其中1是轮换中订单更改前项目的原始索引。 该索引似乎是使用jcarousel:animateend事件并调用carousel.index($(this).jcarousel('first'))可检索的jcarousel:animateend 。
但是，一旦您开始重新排序轮播中的项目，该事件将不再有用，并且ID中的数字现在具有误导性。 因此，我们需要使用
中
的位置来确定当前项的索引。
使用jquery获取项目的当前索引的另一个解决方案…
//jcarousel item becomes visible $('.jcarousel').on('jcarousel:visiblein', 'li', function(event, carousel) { // "this" refers to the item element itemCount = $(".jcarousel li").length; //1 based currentIndex = ($( "li" ).index($(this))); //0 based if(currentIndex + 1 == itemCount) { alert('last'); } if(currentIndex == 0) { alert('first'); } });
var jcarousel = $('.jcarousel').on('jcarousel:createend', function(event, carousel) { do_something_with_current_slide(carousel); //in case if you need current slide on the begining }) .on('jcarousel:animateend', function(event, carousel) { do_something_with_current_slide(carousel); //do something with current slide right after animation ends }) .jcarousel({ wrap: 'circular' }); function do_something_with_current_slide(carousel){ li = carousel._target; //li of current slide alert(li.attr('slide')); }
您可以使用任意数量的属性来识别内部的幻灯片和数据