大学生纪录作业!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
function mei(){
var meibutton=document.getElementById("smei");
var tu1=document.getElementById("tu");
tu1.src=meibutton.src;
}
function lan(){
var meibutton=document.getElementById("slan");
var tu1=document.getElementById("tu");
tu1.src=meibutton.src;
}
function zhu(){
var meibutton=document.getElementById("szhu");
var tu1=document.getElementById("tu");
tu1.src=meibutton.src;
}
function ju(){
var meibutton=document.getElementById("sju");
var tu1=document.getElementById("tu");
tu1.src=meibutton.src;
}
</script>
<input type="button" οnclick="mei()" value="梅" id="smei" src="img/梅.jpg"/>
<input type="button" οnclick="lan()" value="兰" id="slan" src="img/兰.png"/>
<input type="button" οnclick="zhu()" value="竹" id="szhu" src="img/竹.jpg"/>
<input type="button" οnclick="ju()" value="菊" id="sju" src="img/菊.jpg"/>
<br />
<img src="" id="tu"/>
<br />
<script>
function changetu(){
var url=document.getElementById("sitem");
var url2=document.getElementById("tu2")
url2.src=url.value;
}
</script>
<div>
<form>
<select id="sitem" οnchange="changetu()">
<option value="img/梅.jpg" id="smei2" >梅</option>
<option value="img/兰.png" id="slan2">兰</option>
<option value="img/竹.jpg" id="szhu2">竹</option>
<option value="img/菊.jpg" id="sju2">菊</option>
</select>
</form>
<img src="" id="tu2" />
</div>
</body>
</html>
点击前
点击后