2015-08-21 118 views
1

如何在1分钟后停止setTimeout。它继续因为循环.TIA1分钟后停止setTimeout。循环

<script type="text/javascript">  
var image1 = new Image() 
image1.src = "images/slide1.jpg" 
var image2 = new Image() 
image2.src = "images/slide2.jpg" 
</script> 
<body> 
<p><img src="images/pentagg.jpg" width="500" height="300" name="slide" /></p> 
<script type="text/javascript"> 
    var step=1; 
    function slideit() 
    { 
     document.images.slide.src = eval("image"+step+".src"); 
     if(step<2) 
      step++; 
     else 
      step=1; 
     setTimeout("slideit()",2500); 
    } 
    slideit(); 
</script> 

我尝试了很多东西,但我仍然无法解决这个问题。我会感谢任何帮助。感谢

回答

0

尝试一个名为setTimeout

var image1 = new Image(); 
 
image1.src = "images/slide1.jpg"; 
 
var image2 = new Image(); 
 
image2.src = "images/slide2.jpg"; 
 

 
var step = 1, timer; // declare here 
 

 
function slideit() { 
 
    
 
    if(timer){ // check if there is any timeout been set 
 
    setTimeout(function(){ 
 
     clearTimeout(timer); // clear the timer here 
 
    },5000); // change it to 60*1000 for 1 min == 60 sec == 60000 ms 
 
    } 
 
    
 
    document.images.slide.src = eval("image" + step + ".src"); 
 
    if (step < 2) 
 
    step++; 
 
    else 
 
    step = 1; 
 
    timer = setTimeout("slideit()", 500); // assign a timer here 
 
} 
 
slideit();
<p> 
 
    <img src="images/pentagg.jpg" width="500" height="300" name="slide" /> 
 
</p>

+0

谢谢。 :-) 得到它了! – user3926729

+0

@ user3926729很高兴这是一个帮助,并欢迎您 – Jai

+0

再次。 :-)如何添加我的图像使用一个简单的淡入淡出和/或淡出我对J/S新@ J @ – user3926729

0

尝试这样

setTimeout(function(){ 
    slideit(); 
},2500); 
0

您可以使用计时器像

var imgs = ['//placehold.it/500X300&text=1', '//placehold.it/500X300&text=2'], 
 
    idx = 0, 
 
    start = new Date(); 
 

 
function slideit() { 
 
    document.images.slide.src = imgs[idx++]; 
 
    if (idx >= imgs.length) { 
 
    idx = 0; 
 
    } 
 

 
    if (new Date().getTime() - start.getTime() > 10000) { 
 
    clearTimeout(interval) 
 
    } 
 
} 
 
var interval = setInterval(slideit, 2500); 
 
slideit();
<p> 
 
    <img src="images/pentagg.jpg" width="500" height="300" name="slide" /> 
 
</p>