проблема разбиения слайдшоу на страницы jQuery

Я новичок в jQuery и пытаюсь создать пользовательский виджет слайд-шоу для страницы, которую я разрабатываю. Я смог заставить работать все основные биты (автозапуск, пауза, подписи), но я столкнулся с препятствием с разбиением на страницы (позволяет выбрать слайд). По какой-то причине, как только я пытаюсь выбрать слайд, изображение и подписи исчезают. Никаких ошибок не выбрасывается, он просто отказывается переключать изображение или заголовок. Код ересей:

Этот бит кода запускает слайд-шоу и управляет им 

$(document).ready(function () {
    var speed = 2000;                            
    var state = 1;                                          

       $('#gallery li, #caption li').css('position','absolute');         

       $('#gallery li:first, #caption li:first').addClass('visible');             

       var timer = setInterval('autoSlideshow(-1)', speed);             

    $('#controls a.playpause').toggle(
        function () {
            $(this).css('background-image','url(images/play.png)');  
            clearInterval(timer);
            state = 0;
            return false;  
        },
        function() {        
            $(this).css('background-image','url(images/pause.png)');
            timer = setInterval('autoSlideshow(-1)', speed);
            state = 1;
            return false; 
        }
    );           

    $('#controls a.pagination').click( function(){
        var slide = $(this).index();

        slide-=1;
        clearInterval(timer);   
        timer = setInterval(function(){autoSlideshow(slide);}, speed);


    });


    $('#gallery, #caption').hover(                               
        function() {
            if(state == 1)  
                clearInterval(timer); 
        },   
        function() {
            if (state == 1)  
                timer = setInterval('autoSlideshow(-1)', speed); 
        }  
    );


});

Этот бит делает замирание в и из слайдов 

    function autoSlideshow(mode) {
    var currentImage = $('#gallery li.visible');                                   
    var currentCaption = $('#caption li.visible');

    if(mode == -1){
        var nextImage = currentImage.next().length ? currentImage.next() :        
                    currentImage.siblings(':first');        
        var nextCaption = currentCaption.next().length ? currentCaption.next() :          //Determine the next slide
                    currentCaption.siblings(':first');
    }
    else{
        var nextImage = $('#gallery li:eq(mode)');   //I'm pretty sure these two lines are the problem
        var nextCaption = $('#caption li:eq(mode)'); //
    }  

    currentImage.fadeOut(250).removeClass('visible');
    nextImage.fadeIn(250).addClass('visible');  
    currentCaption.fadeOut(250).removeClass('visible');
    nextCaption.fadeIn(250).addClass('visible');


}
Любая помощь, которую вы, ребята, можете оказать, будет оценена по достоинству.

МО

1 3
jquery slideshow

1 ответ:

Строковая константа против переменной.... попробуйте это: 

    var nextImage = $('#gallery li:eq('+mode+')'); 
    var nextCaption = $('#caption li:eq('+mode+')');

Это должно преобразовать mode в строку, таким образом, eq получит число вместо слова "mode".

(NB: я просто посмотрел на выделенную вами строку, я не проверял и не тестировал остальную часть программы, могут быть и другие проблемы.)

Отредактируйте, чтобы ответить на вопрос ниже

Вы просто смотрите на это сбоку. Помните ,что "бла-бла-бла" - это строковая константа. Она не оценивается. Он остается статичным и не меняется. изменение. Другой способ взглянуть на это-вспомнить разницу между компилятором и функцией jQuery. Это то, что компилятор видит в моем утверждении

Возьмите строковую константу '#caption li:eq(' добавьте к ней значение переменной mode (неявное преобразование), затем добавьте к ней строковую константу ')' передайте результат функции jQuery.

Таким образом, функция jQuery будет вызвана со следующим строковым параметром (если mode имеет значение 9):

'#caption li:eq(9)'

В вашем коде jQuery был вызван со следующим строковым параметром

'#caption li:eq(mode)'

Ясно ли это?

0