如果setInterval正在运行，则会发生冲突

Posted 2021-04-07

我没有设法找到脚本的方法：如果用户按下next按钮，停止autoplay，否则：继续autoplayand继续显示pause按钮。

谢谢。 :)

$(function() {
var timer;
function autoplay() {
    timer = setInterval(function() {
        $('#next-icon').click();
    }, 5000);
};

$('#prev-icon, #next-icon').click(function() {
    switch (this.id) {
        case 'prev-icon':
            $('#pause-icon').hide(); $('#play-icon').show(); 
            clearInterval(timer);
            break;
        case 'next-icon': 
            $('#pause-icon').hide(); $('#play-icon').show(); 
            clearInterval(timer);
            break;
    }
}); });

答案

这是方式：

    $(function() {
var timer;
function autoplay() {
        timer = setInterval(function() {
            $('#next-icon').trigger('click', true);
        }, 5000);
    };

$('#prev-icon, #next-icon').click(function(event, play) {
    switch (this.id) {
        case 'prev-icon':
            $('#pause-icon').hide(); $('#play-icon').show();
            clearInterval(timer);
            break;
        case 'next-icon':
            if (play) {
                    setInterval(timer);
                } else {
                    $('#pause-icon').hide(); $('#play-icon').show(); clearInterval(timer);
                }
            break;
    }
});
});