使用bxSlider的奇怪jQuery行为 - 不给我变量中的整数值

时间:2014-06-10 18:48:26

标签: javascript jquery bxslider

我正在使用名为bxSlider的jQuery插件。这个滑块有一个名为goToSlide的功能,它应该将滑块放到特定的幻灯片上。我在解决这个问题并遇到一些奇怪的行为时遇到了问题。

这是我的代码:

function changeSlideAfterChangeImage(currentlySelected) {
var currentImageIndex = $('*[data-thumb-image-id="'+currentlySelected+'"]').parent().data("slide-index");

$('.active-slide').removeClass('active-slide');
thisBxSlider.goToSlide( parseInt(currentImageIndex) );

}

变量currentImageIndex给出了正确的值,如'5',但滑块始终位于最后一张幻灯片上。

现在是奇怪的行为......

如果我专门设置currentImageIndex,滑块会一直转到该幻灯片(即工作正常)。

function changeSlideAfterChangeImage(currentlySelected) {
var currentImageIndex = 5; // THIS WORKS

$('.active-slide').removeClass('active-slide');
thisBxSlider.goToSlide( parseInt(currentImageIndex) );

}

此外,如果我增加currentImageIndex,则滑块会更改并转到正确的滑块旁边的幻灯片。

function changeSlideAfterChangeImage(currentlySelected) {
var currentImageIndex = $('*[data-thumb-image-id="'+currentlySelected+'"]').parent().data("slide-index");
currentImageIndex = currentImageIndex + 1; // THIS WORKS CORRECTLY IN THAT IT GOES TO THE SLIDE *AFTER* TO THE CORRECT ONE

$('.active-slide').removeClass('active-slide');
thisBxSlider.goToSlide( parseInt(currentImageIndex) );

}

然而,如果我这样做......

function changeSlideAfterChangeImage(currentlySelected) {
var currentImageIndex = $('*[data-thumb-image-id="'+currentlySelected+'"]').parent().data("slide-index");
currentImageIndex = currentImageIndex + 1; 
currentImageIndex = currentImageIndex - 1; // THIS DOESN'T WORK - THE SLIDER JUST SITS ON THE LAST SLIDE 

$('.active-slide').removeClass('active-slide');
thisBxSlider.goToSlide( parseInt(currentImageIndex) );

}

这也不起作用......

function changeSlideAfterChangeImage(currentlySelected) {
var currentImageIndex = $('*[data-thumb-image-id="'+currentlySelected+'"]').parent().data("slide-index");
currentImageIndex = currentImageIndex + 1; 
var tryAnotherVar = currentImageIndex - 1; // THIS DOESN'T WORK - THE SLIDER JUST SITS ON THE LAST SLIDE 

$('.active-slide').removeClass('active-slide');
thisBxSlider.goToSlide( parseInt(tryAnotherVar) );

}

我完全难过......有什么想法吗?

2 个答案:

答案 0 :(得分:1)

这似乎不是滑块的问题,而是 currentImageIndex 的值。

  • 如果值超出范围(例如,如果你有5张幻灯片0..4那么你就不能去幻灯片#5,因为索引是基于零而最后一张幻灯片是#4)这不是关于你的特定例子,只是一个大致的想法,为什么它可能不起作用。

  • 该值不是整数

    如果更改

    ,可以轻松检查
    var currentImageIndex = 5; // THIS WORKS
    

    var currentImageIndex = '5';  
    

    你会发现它也会起作用。所以我认为$('*[data-thumb-image-id="'+currentlySelected+'"]').parent().data("slide-index")的值不同于5(可能包括特殊字符等)

至于另一个例子

currentImageIndex = currentImageIndex + 1; 
currentImageIndex = currentImageIndex - 1; // THIS DOESN'T WORK - THE SLIDER JUST SITS ON THE LAST SLIDE 

很容易:加1并减去1等于相同的值。

答案 1 :(得分:1)

这个问题的答案(经过大量调查后)与创建滑块的顺序以及要求它转到特定幻灯片的命令有关。

在我完全正常工作之前,我似乎要求它去一张特定的幻灯片。因此,当我将“警报”放入代码中以调试某些情况时,它就起作用了,因为警报必须给滑块时间初始化等。

现在排序......我生命中的另外几个小时我将永远不会回来。有没有想过为什么我们把生活倒进电脑而不是像其他人一样坐在阳光下???