JavaScript的循环图像幻灯片

Question

var imag = document.getElementById('contentimage'); 
      var imagarr = ["images/contimgtwo.jpg","images/contimg.jpg"] 
      //var convertimg = imagarr[i].toString(); 
      var runtext = function(){ 
       for (i=0;i<imagarr.length;i++){ 

       imag.src=imagarr[i]; 
       } 
      } 
     setTimeout(runtext,5000); 

CSS：

#contentimage { 
    display:block; 
    top:1600px; 
    width:500px; 
    height:400px; 
    position:absolute; 
} 

    #contentimage:hover { 
     opacity:0.5; 
     cursor:crosshair; 
    } 

我试图做一个图像幻灯片使用for循环，这个想法是，它将提供与图像路径的.src路径从数组中，但问题是.src =“”方法需要你“”，所以我不能调用该数组，因此它找不到图像，以任何方式？

Answer 1

您不应该在您的runtext函数中循环整个数组。这样做实际上只应用数组的最后一个值，并始终显示最后一个图像。这是您的脚本可能工作的修改：

var imag = document.getElementById('contentimage'); 
var imagarr = ["images/contimgtwo.jpg", "images/contimg.jpg"]; 
var index = 0, interval; 
var runtext = function(){ 
    imag.src = imagarr[index]; 
    if(index < imagarr.length-1) { 
     index += 1; 
    } else { 
     index = 0; 
    } 
    interval = setTimeout(runtext, 5000); 
} 
var stopText = function() { 
    clearTimeout(interval); 
} 
interval = setTimeout(runtext, 5000); 

我添加了一个函数，停止幻灯片。您仍会浏览数组中的所有元素，但索引在每次调用时都会递增。