jquery를 사용하여 다른 함수를 토글하고 왼쪽에서 다시 시작하지 않음

첫 번째 함수의 코드는 특정 간격 5 초 (div1, div2, div3)에 세 개의 다른 div를 표시합니다.
div 표시를 중지하는 데 사용되는 두 번째 함수의 코드입니다.

div2를 보여 주면서 링크를 클릭하면 멈추게됩니다.
하지만 그 후에 다시 클릭하면 div1 (잘 작동 함)이 표시되지만 div3을 표시하는 다음 작업을 계속하고 싶습니다.
jquery를 사용하여 다른 함수를 토글하고 왼쪽에서 다시 시작하지 않음

JQuery와 코드 :

$(function() { 

var IntervalId; 

function first_function() { 
var counter = 0, 
divs = $('#div1,#div2,#div3'); 
function showDiv() { 
      divs.hide() // hide all divs 
      .filter(function (index) { return index == counter % 3; }) 
      .show('fast'); // and show it 
      counter++; 
}; 
showDiv();  
IntervalId = setInterval(showDiv, 5000); 
}; 

function second_function(){ 
    clearInterval(IntervalId); 
} 

$("#link1").toggle(
first_function,second_function 
); 

});

html로 코드 :

<a href="javascript:void(0);" id="link1">Toggle</a>

출처

2009-05-29 Webrsk

이 first_function 외부 카운터의 초기화() 이동

: 당신의 예에서

$(function() { 

var IntervalId; 
var counter = 0, 

function first_function() { 
divs = $('#div1,#div2,#div3'); 
...

을 때마다 당신은 카운터는 0으로 다시 설정() first_function를 호출합니다.

출처

2009-05-29 07:25:48

재밌게과 :

<script type="text/javascript"> 
$(function() { 
    var divFunctions = []; 
    var $divs = $('#div1,#div2,#div3'); 

    $divs.each(function() { 
    var $this = $(this); 
    divFunctions.push(function() { 
     return function() { 
     $divs.not($this).hide(); 
     $this.show("fast") 
     }; 
    }()); 
    }); 

    var $toggle_button = $("#link1"); 
    $toggle_button.toggle.apply($toggle_button, divFunctions); 
}); 
</script> 

<body> 
    <a href="javascript:void(0);" id="link1">Toggle</a> 

    <div id='div1' style="display:none;">content1</div> 
    <div id='div2' style="display:none;">content2</div> 
    <div id='div3' style="display:none;">content3</div> 
</body>

출처

2009-05-29 12:38:10 Tomalak

jquery를 사용하여 다른 함수를 토글하고 왼쪽에서 다시 시작하지 않음

답변

관련 문제