标签：options one 自己 value cti 快速 包括 时间 length
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js实现点击下拉框选中对应的div</title>
<style type="text/css">
div{display:none;}
</style>
</head>
<body>
<select name="select1" id="select1">
<option name="option1" id="option1" value="value1">11111111</option>
<option name="option2" id="option2" value="value2">22222222</option>
<option name="option3" id="option3" value="value3">33333333</option>
<option name="option4" id="option4" value="value4">44444444</option>
<option name="option5" id="option5" value="value5">5555555</option>
</select>
<div id="div1">我以为哪位好心的弟兄姐妹来劝我悔改，不要在反对基督教的路上越走越远。谁知是陌生人 群发的电邮，看完内容后，我大惊失色。</div>
<div id="div2">结尾段，给出了联络方式。我统计了一下，包括遍布南京的十所高校的联系方式，范围之广令人吃惊。（其中还包括了有军工背景的高校：南京理工大学，南京航空航天大学。）</div>
<div id="div3">端的技术日渐更新，最近得空，花了一上午的时间，将前端常见的UI框架总结了一下，在开发的过程之中，有了这些，不断能够提高自己的工作效率，还可以在工作之余了解更多。希望大家喜欢</div>
<div id="div4">ayui是一款采用自身模块规范编写的国产前端UI框架，遵循原生HTML/CSS/JS的书写与组织形式，门槛极低，拿来即用</div>
<div id="div5">从核心代码到API的每一处细节都经过精心雕琢，非常适合界面的快速开发。，从核心代码到API的每一处细节都经过精心雕琢，非常适合界面的快速开发。</div>
</body>
<script>
var select = document.getElementById("select1");
select.onchange = function(){
var options = select.getElementsByTagName("option");
for(var i = 0; i < options.length; i++){
if(options[i].selected){
var divid = options[i].id.replace("option","div");
var divs = document.getElementsByTagName("div");
for(var j = 0; j < divs.length; j++){
if(divid == divs[j].id){
divs[j].style.display = "block";
}else{
divs[j].style.display = "none";
}
}
}
}
}
</script>
js实现点击下拉框选中对应的div
标签：options one 自己 value cti 快速 包括 时间 length
原文地址：http://www.cnblogs.com/Yoko-815/p/7462251.html
