是這麼想的工作，一個簡單的JavaScript代碼@ _ @

OK，這裏是東西，我寫了一個幻燈片一個簡單的代碼，它的工作原理，它是如我所料，這就是它：是這麼想的工作，一個簡單的JavaScript代碼@ _ @

var slideShowImage = document.getElementById("slideShowImage"); 
var images = ["_Images/Image_01.jpg","_Images/Image_02.jpg","_Images/Image_03.jpg","_Images/Image_04.jpg","_Images/Image_05.jpg","_Images/Image_06.jpg","_Images/Image_07.jpg"]; 
var imageIndex = 0; 

function changeImage(){ 
    slideShowImage.setAttribute ("src",images[imageIndex]); 
    imageIndex++; 
    if (imageIndex >= images.length){ 
      imageIndex = 0; 
     } 
    } 

setInterval (changeImage,3000);

但是當我還在學習javaScript時，我想改變邏輯來品嚐自己，並且我重寫了代碼，但它不起作用，我不知道爲什麼...... 希望有人能夠啓發我，的...

var imageId = document.getElementById("slideShowImage"); 
var imageNumber = 1; 
var imageName = "_Images/Image_0"+imageNumber+".jpg"; 

function changeImage(){ 
    imageId.setAttribute("Src",imageName); 
    imageNumber++; 
    if (imageNumber==7){ 
     imageNumber=1; 
     } 
    } 
setInterval(changeImage,1000);

來源

2013-04-10 Mohammed Hanafy

你添加了這個事件嗎？我的意思是把它們包裝在一個函數中，然後在window.onload上註冊它。 – 2013-04-10 09:35:46

在第二種方法中，根據您需要重新計算此變量值的第一個答案，將var imageName分配給靜態值，即「_Images/Image_0」+ imageNumber +「。jpg」。

相反，你可以寫imageName作爲函數返回計算值

var imageName = function(){ return "_Images/Image_0"+imageNumber+".jpg"; }

，並調用內部changeImage

function changeImage(){ 
    imageId.setAttribute("Src",imageName()); 
    imageNumber++; 
    if (imageNumber==7){ 
     imageNumber=1; 
     } 
    }

來源

2013-04-10 09:38:48

真棒！它的工作原理，第一次瞭解靜態thingy：P 雖然你爲什麼使用var名稱後的括號？ – 2013-04-10 09:59:10

這是複製粘貼問題，刪除它。 – 2013-04-10 10:02:26

非常感謝您的幫助！我發現你在var name（）後面使用了兩個圓括號：imageId.setAttribute（「Src」，imageName（））; – 2013-04-10 11:35:25

var imageName = "_Images/Image_0"+imageNumber+".jpg";

ÿ每次更改號碼時需要更新imageName。否則，該字符串將固定爲Image_01.jpg。

來源

2013-04-10 09:35:58 drquicksilver

您的imageName變量永遠不會被更新。您必須在每次chageImage調用時更新它。

var imageId = document.getElementById("slideShowImage"); 
var imageNumber = 1; 
var imageName = "_Images/Image_0"+imageNumber+".jpg"; 

function changeImage(){ 
    imageNumber++; 
    imageName = "_Images/Image_0"+imageNumber+".jpg"; 
    imageId.setAttribute("Src",imageName); 
    if (imageNumber==7){ 
     imageNumber=1; 
    } 
} 
setInterval(changeImage,1000);

來源

2013-04-10 09:37:37 Chris

您所犯的錯誤是您的版本中的圖像名稱不會在每次迭代中評估一次。

var imageId = document.getElementById("slideShowImage"); 
var imageNumber = 1; 
setInterval(function() { 
    imageId.setAttribute("src","_Images/Image_0"+imageNumber+"jpg"); 
    imageNumber++; 
    if (imageNumber == 7) imageNumber = 1; 
},1000);

這將導致您的代碼實際工作。我採用了圖像路徑並將其引入到函數中，以便在每次迭代中對其進行評估，這是主要的錯誤。

請注意，您的圖片不會立即加載;將它們設置爲每個轉換1秒是不明智的。在實踐中，你想要將它們全部預加載在背景中的某個不可見的地方，這保證了即時調用。

來源

2013-04-10 09:38:33

可以replase代碼 imageId.setAttribute（「源」，imageName） ; with follwoing imageId.src = imageName;

來源

2013-04-10 09:44:43 aymankoo

是這麼想的工作，一個簡單的JavaScript代碼@ _ @

回答

相關問題