JavaScript对表单元素下拉列表框的设置（图片选择）

JavaScript

一、效果图

二、index.html部分

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
	<title></title>
<script type="text/javascript" src="index.js"></script>
</head>
<body onload="initLogo()">
	<form>
		
		<img id="logoImg" src="image/headLogo/1.gif">
		<select id="logo" onchange="selectLogo()"></select>
	</form>
</body>
</html>

三、index.js部分


function initLogo(){
	var logo=document.getElementById("logo");
	for(i=1;i<=15;i++){
		logo.options.add(new Option(i,i));
	}
}

function selectLogo(){
	var logo=document.getElementById("logo");
	var n=logo.value;
	var logoImg=document.getElementById("logoImg");
	logoImg.src="image/headLogo/"+n+".gif";
}

四、图片文件夹在同目录下

posted @ 2020-08-14 13:17  AlanHong  阅读(413)  评论(0)    收藏  举报