Question

我正在尝试做滑块并遇到一些问题。正如你可以看到我有一个#timer按钮，当你点击按钮时，它会推进下一张幻灯片，它没有问题。

但我想让它点击自己，所以我试图使用setInterval但不能这样做。触发首次点击navitem也没有问题，但是不能在该按钮上设置setInterval。

<script type="text/javascript">
$(window).load(function() {
    $('.slideritem p').stop(true).show(1000);
});

$(document).ready(function() {
    $('.slideritem').hide();
    $('.slideritem:first').fadeIn(1000);

    $('.navitem').click(function () {
        var index = $('.navitem').index(this)
        var indexlast = $('.navitem').index(this) + 1
        $('.slideritem').hide();
        $('.slideritem:nth-child(' + indexlast + ')').stop(true).fadeIn(1000);
        $('.navitem img ').removeClass('current');
        $('.navitem:nth-child(' + indexlast + ') img ').addClass('current');

        $('#timer').click(function () {
            index++$('.slideritem').hide();
            $('.slideritem').eq(index).fadeIn(1000);
            $('.navitem img').removeClass('current');
            $('.navitem img').eq(index).addClass('current');

            if (index == 3) {
                index = -1
            }
        });
    });

    $('.navitem:first').trigger('click');
    setInterval($('#timer').trigger('click'), 1500);
});    
</script>

Answer 1

不要为此触发click事件。这是一个坏习惯。

为滑动效果创建单独的功能。然后单击并从计时器单独调用它。

应该是这样的：

function Slide() {
    // Perform the sliding here
}

$('#timer').click(Slide);

setInterval(Slide,1500);

我为您的代码做了一些改进，现在它正在运行。还有几件事你可以改进......

jsFiddle Demo

滑块前进按钮上的jQuery setInterval

1 个答案: