如何循環中Jquery的

-2

按鈕

<input type="button" value="change" id="change" onclick="go()" class="button">

這個功能

function go(){ 
 
\t \t $("#theImage").attr("src", "heart.jpg"); 
 
};

我也有另一張照片保存在文件根目錄。

所以，當我按下按鈕時，圖片變成另一張圖片，那部分工作，但是當我再次按下時，它不會將圖片更改爲下一張（或上一張），我該如何使它工作？

全碼：

<!doctype html> 
 
<html> 
 
<head> 
 
<title>A Basic Form</title> 
 
<script type="text/javascript" src="jquery-1.8.1.min.js"></script> 
 
<link rel="stylesheet" type="text/css"> 
 
<style type="text/css" href="Template.css"> 
 

 
</style> 
 
</head> 
 
<body> 
 
<input type="button" value="change" id="change" onclick="go()" class="button"> 
 

 
<img src="square.jpg" alt="square" id="theImage" /> 
 
<script type="text/javascript"> 
 

 
function go(){ 
 
\t \t $("#theImage").attr("src", "heart.jpg"); 
 
}; 
 

 
\t 
 
</script> 
 
</body> 
 
</html>

來源

2014-10-18 Den

是什麼下一個或上一個圖像？你所做的只是告訴那個圖像改成heart.jpg。它不會做別的。 – haxtbh 2014-10-18 16:24:25

它的廣場，但我怎麼能使它工作，就像我繼續按它會每次都會改變 – Den 2014-10-18 16:25:33

你只是想在這兩個圖像之間切換或讓你想要添加更多的圖像？ – haxtbh 2014-10-18 16:26:25

你可以做這樣的事情，這將切換圖片：

function go(){ 
    var src = ($("#theImage").attr('src') === 'square.jpg') ? 'heart.jpg' : 'square.jpg'; 
    $("#theImage").attr('src', src); 
}

來源

2014-10-18 16:31:58 haxtbh

你已經把它改成heart.jpg。現在，如果你想設置的循環方式，使用此javascript：

<script> 
var i = 0; 
var imgarray = ['1.jpg', '2.jpg' ...]; 

function go(){ 
     $("#theImage").attr("src", imgarray[i]); 
     i++; 
} 

</script>

而且

<input type="button" value="change" id="change" onclick="go()" class="button">

來源

2014-10-18 16:25:33 mehulmpt

所以我得到這個： var i = 0; var imgarray = [「square.jpg」，「heart.jpg」]; function go（）{ \t \t $（「＃theImage」）。attr（「src」，imgarray [i]）; \t \t i ++; }; 但它似乎沒有工作？ – Den 2014-10-18 16:28:54

它在我的工作結束。檢查控制檯的錯誤。 – mehulmpt 2014-10-18 16:30:25

'i ++'應該是'i =（i + 1）％imgarray.length' – Stryner 2014-10-18 16:32:11

如何循環中Jquery的

回答

相關問題