如标题所示,我有一排4张图片。当我单击它们时,它们将变为另一种。当所有4张图片都更改后,我希望该功能将我转移到新的URL。
这必须在javascript中。
这是我走了多远:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<link href="datemedmig.css" type="text/css" rel="stylesheet">
<title>Uppgift B</title>
<script>
function changePic1 (guy1)
{
document.getElementById("guy1").src ="1b.jpg";
}
function changePic2 (guy2)
{
document.getElementById("guy2").src ="2b.jpg";
}
function changePic3 (guy3)
{
document.getElementById("guy3").src ="3b.jpg";
}
function changePic4 (guy4)
{
document.getElementById("guy4").src ="4b.jpg";
}
</script>
<img id="guy1" src="1a.jpg" onclick=changePic1(this.name)>
<img id="guy2" src="2a.jpg" onclick=changePic2(this.name)>
<img id="guy3" src="3a.jpg" onclick=changePic3(this.name)>
<img id="guy4" src="4a.jpg" onclick=changePic4(this.name)>
</head>
</html>
任何帮助将不胜感激!
最好的祝福
一个失落的男孩
最佳答案
var arr = [false, false, false, false];
function save(index){
arr[index] = true;
if(arr.filter(function(item){ return !item; }).length == 0)
location.href = "YOUR_HREF";
}
function changePic1 (guy1)
{
document.getElementById("guy1").src ="1b.jpg";
save(0);
}
function changePic2 (guy2)
{
document.getElementById("guy2").src ="2b.jpg";
save(1);
}
function changePic3 (guy3)
{
document.getElementById("guy3").src ="3b.jpg";
save(2);
}
function changePic4 (guy4)
{
document.getElementById("guy4").src ="4b.jpg";
save(3);
}