JavaScript 判断下拉列表
发布网友
发布时间：2022-04-27 02:14
共2个回答
热心网友
时间：2022-04-27 03:43
function select_change(_select) {
var index=_select.value;
for(i=0;i<9;i++){
var place = document.getElementById("place"+i).style.display="none";
}
var place = document.getElementById("place"+index).style.display="inline";
}
</script>
<div id="r_ckbox">
<select name="headimage" id="headimage" class="box" onchange="select_change(this)">
<option value="0" selected="selected">默认头像</option>
<option value="1">男头像1</option>
<option value="2">男头像2</option>
<option value="3">男头像3</option>
<option value="4">女头像1</option>
<option value="5">女头像2</option>
<option value="6">女头像3</option>
<option value="7">其他1</option>
<option value="8">其他2</option>
</select>
</div>
<div id="r_image">
<img src="photo/girl0.jpg" width="60" height="60" id="place0" />
<img src="photo/girl1.jpg" width="60" height="60" id="place1" style="display:none"/>
<img src="photo/girl2.jpg" width="60" height="60" id="place2" style="display:none"/>
<img src="photo/girl3.jpg" width="60" height="60" id="place3" style="display:none"/>
<img src="photo/girl4.jpg" width="60" height="60" id="place4" style="display:none"/>
<img src="photo/girl5.jpg" width="60" height="60" id="place5" style="display:none"/>
<img src="photo/girl6.jpg" width="60" height="60" id="place6" style="display:none"/>
<img src="photo/girl7.jpg" width="60" height="60" id="place7" style="display:none"/>
<img src="photo/girl8.jpg" width="60" height="60" id="place8" style="display:none"/>
</div>
这样试试看，这种方法重效率上应该会快一点
热心网友
时间：2022-04-27 05:01
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css">
<!--
img {
margin: 50px auto auto 100px;
height: 80px;
width: 80px;
}
-->
</style>
</head>
<body>
<div id="r_ckbox">
<select name="headimage" class="box">
<option value="0" selected="selected">默认头像</option>
<option value="1">男头像1</option>
<option value="2">男头像2</option>
</select>
</div>
<div id="r_image">
<img src="photo/img_1.gif" width="60" height="60" id="place" />
</div>
<script type="text/javascript">
document.getElementsByTagName("select")[0].onchange = function() {
var index = this.value;
var place = document.getElementById("place");
place.src = "photo/img_" + index + ".gif";
}
</script>
</body>
</html>
注意：photo目录下的图片文件应该统一名称为img_1.gif, img_2.gif, ....等等。如果是jpg格式的（只能用一种格式哦），则要把脚本里面的".gif"改为".jpg"
