下拉菜单修改DIV显示的内容
作者：zhirong1230 创建时间：2017-06-10 阅读次数：879
<!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>下拉菜单修改DIV显示的内容</title>
<link type="text/css" rel="stylesheet" href="css/text.css">
</head>
<script type="text/javascript">
function test(Names){
var Name
for (var i=1;i<4;i++){ // 更改数字4可以改变选择的内容数量，在下拉总数值的基础上+1.比如：下拉菜单有5个值，则4变成6
var tempname="mune_x"+i
var NewsHot="x"+i // “X”是ID名称，比如：ID命名为“case1”，这里的“X”即为“case”
if (Names==tempname){
Nnews=document.getElementById(NewsHot)
Nnews.style.display='';
}else{
Nnews=document.getElementById(NewsHot)
Nnews.style.display='none';
}
}
}
</script>
<body>
<fieldset class="cont">
<div class="list">
<label><s>*</s>验证方式：</label>
<select size="1" name="D1" onChange="javascript:test('mune_x'+this.value)">
<option value="1">密保手机</option>
<option value="2">密保邮箱</option>
<option value="3">密保问题</option>
</select>
</div>
<!-------------------------------选择密保手机-------------------------------------->
<div class="list" id="x1">
<label><s>*</s>密保手机：</label>
<input type="text" value="" name="phone" placeholder="请输入密保手机">
</div>
<!-------------------------------选择密保邮箱-------------------------------------->
<div class="list" id="x2" style="display:none">
<label><s>*</s>密保邮箱：</label>
<input type="email" value="" name="email" placeholder="请输入密保邮箱">
</div>
<!-------------------------------选择密保问题-------------------------------------->
<div class="fl" id="x3" style="display:none">
<div class="list">
<div class="ask">
<label><s>*</s>问题一：</label>
<select name="question1">
<option selected="selected" value="0">请选择密保问题</option>
<option value="1">您母亲的姓名是？</option>
<option value="2">您母亲的生日是？</option>
<option value="3">您父亲的姓名是?</option>
<option value="4">您父亲的生日是？</option>
<option value="5">您配偶的姓名是？</option>
<option value="6">您配偶的生日是？</option>
<option value="7">您的学号（或工号）是？</option>
<option value="8">您高中班主任的名字是？</option>
<option value="9">您小学班主任的名字是？</option>
<option value="10">您初中班主任的名字是？</option>
<option value="11">您最熟悉的童年好友名字是？</option>
<option value="12">您家在哪？</option>
<option value="13">对您影响最大的人名字是？</option>
</select>
</div>
<div class="answer">
<label><s>*</s>答案：</label>
<input type="text" value="">
</div>
</div>
<div class="list">
<div class="ask">
<label><s>*</s>问题二：</label>
<select name="question2">
<option selected="selected" value="0">请选择密保问题</option>
<option value="2">您母亲的生日是？</option>
<option value="3">您父亲的姓名是?</option>
<option value="4">您父亲的生日是？</option>
<option value="5">您配偶的姓名是？</option>
<option value="6">您配偶的生日是？</option>
<option value="7">您的学号（或工号）是？</option>
<option value="8">您高中班主任的名字是？</option>
<option value="9">您小学班主任的名字是？</option>
<option value="10">您初中班主任的名字是？</option>
<option value="11">您最熟悉的童年好友名字是？</option>
<option value="12">您家在哪？</option>
<option value="13">对您影响最大的人名字是？</option>
</select>
</div>
<div class="answer">
<label><s>*</s>答案：</label>
<input type="text" value="">
</div>
</div>
<div class="list">
<div class="ask">
<label><s>*</s>问题三：</label>
<select name="question3">
<option selected="selected" value="0">请选择密保问题</option>
<option value="1">您母亲的姓名是？</option>
<option value="2">您母亲的生日是？</option>
<option value="3">您父亲的姓名是?</option>
<option value="4">您父亲的生日是？</option>
<option value="5">您配偶的姓名是？</option>
<option value="6">您配偶的生日是？</option>
<option value="7">您的学号（或工号）是？</option>
<option value="8">您高中班主任的名字是？</option>
<option value="9">您小学班主任的名字是？</option>
<option value="10">您初中班主任的名字是？</option>
<option value="11">您最熟悉的童年好友名字是？</option>
<option value="12">您家在哪？</option>
<option value="13">对您影响最大的人名字是？</option>
</select>
</div>
<div class="answer">
<label><s>*</s>答案：</label>
<input type="text" value="">
</div>
</div>
</div>
</fieldset>
</body>
</html>
关键词(keywords)：下拉菜单修改DIV显示的内容
前一篇： 日本购物中心派出机器人待客：仪态优美 擅长倾听 后一篇：10年后，中国这些汽车品牌很有可能赶英 超美 爆德系
