Пользовательский JQuery плагин auto advance bug

Question

Я пытаюсь добавить автоматическое продвижение в плагин jquery, который я сделал сам. Ползунок имеет следующий и предыдущие кнопки.

Я создал CLICK Simulation функцию

var autoAdvance = function(){ 
    $('#next').trigger('click'); 
    }; 

Я хочу функцию autoAdvance к огня, если авто установлен в истинное и остановки, если управления (следующая и предыдущая кнопки) защелкиваются , Эта часть - остановки авто заранее - не работает

if(settings.auto === true){ 
    setInterval(autoAdvance, settings.pause); 
    // Stop auto advance if controls are clicked 
    $('.controlls a').on('click', function(){ 
     clearInterval(autoAdvance); 
    }); 
    }; 

Где я ошибаюсь? Спасибо!

Answer 1

Это рабочее решение, которое я придумал для имитации нажмите на кнопку «Далее» каждые п миллисекунд и остановки автоматическое продвижение, если реальный нажмите происходит:

// Auto advance 
    if(settings.auto === true){ 

    var autoAdvanceInterval = null; 

    $(window).load(function(){ 
     autoAdvanceInterval = setInterval(function(){ 
     $('#next').trigger('click'); 
     }, settings.pause); 
     // When a control or dot is clicked by user 
     // stop autoadvance by clearInterval method 
     $('.controls a,.bullets li').click(function(event) { 
     if (event.originalEvent !== undefined) { 
      clearInterval(autoAdvanceInterval); 
     } 
     }); 
    }); 
    } 

Answer 2

попробовать что-то вроде этого:

var interval; 
if(settings.auto === true){ 
    interval = setInterval(autoAdvance, settings.pause); 
    // Stop auto advance if controls are clicked 
    $('.controlls a').on('click', function(){ 
    clearInterval(interval); 
    }); 
}; 

Было бы идеально, если вы можете создать некоторые jsFiddle, чтобы проверить это, но в любом случае попробовать с моим ответом.

Answer 3

$(document).ready(function(){ 
 
    
 
    var autoInterval = null; 
 
    var settings ={}; 
 
    settings.auto = true; 
 
    settings.pause = 2000; //3 sec 
 
    $('.message span').fadeOut(); 
 
    
 
    var autoAdvance = function(){ 
 
    $('.next').data("auto", true); 
 
    $('.next').trigger('click'); 
 
    }; 
 
    
 
    
 
    autoInterval = setInterval(autoAdvance, 5000); 
 
    // Stop auto advance if controls are clicked 
 
    $('.next').on('click', function(){ 
 
    
 
    $('.message span').fadeIn(400).delay(1000).fadeOut(400); 
 
    var isAuto = $('.next').data("auto"); 
 
    if(isAuto !==true){ 
 
     clearInterval(autoInterval); 
 
     $('.message span').fadeIn(); 
 
    } 
 
    
 
    $('.next').data("auto",false); 
 
    }); 
 
    
 
    
 
});

.message{ 
 
    min-height:50px; 
 
    min-width:100px; 
 
    border:1px solid red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div class="message"><span>clicked</span></div> 
 
<button class="next">Next</button>

Answer 4

setInterval часть должна выглядеть следующим образом

settings.intervalHandler = setInterval(autoAdvance, settings.pause); 
... 
clearInterval(settings.intervalHandler); 

И - возможно

• контролирующая - возможно опечатка?
• если код работает более чем один раз, settings.auto по-прежнему верно