Posted on 2010-07-04 18:51
幻海蓝梦 阅读(1062)
评论(2) 编辑 收藏 所属分类:
JS
原文：
http://zhidao.baidu.com/question/91138063.html?fr=qrl&cid=93&index=2&fr2=query
问题补充：我要在同一网页内用select联动几个form表单，不跳转页面的
我建了一个select菜单，想联动几个表单，代码是：
<select name=s1>
<option value='week'>一周＜／option>
<option value='month'>一月＜／option>
<option value='year'>一年＜／option>
</select>
我建了三个表单form，代码如下：
表单一：
<form name=formWeek>
<table>
<tr>
<td>请输入一周的次数：＜／td>
<td><input type=text size=3></td>
</tr>
</table>
</form>
表单二：
<form name=formMonth>
<table>
<tr>
<td>请输入一月的次数：＜／td>
<td><input type=text size=3></td>
</tr>
</table>
</form>
表单三：
<form>
<table>
<tr>
<td>请输入一年的次数：</td>
<td><input type=text size=3></td>
</tr>
</table>
</form> 全部代码如下,测试通过.
<html>
<head><title>切换</title></head>
<body>
<select name="s1" onchange="changeform(this.value)">
<option value='week'>一周</option>
<option value='month'>一月</option>
<option value='year'>一年</option>
</select>
<br />
<div id="form1">
<form name=formWeek>
<table>
<tr>
<td>请输入一周的次数：</td>
<td><input type=text size=10></td>
</tr>
</table>
</form>
</div>
<div id="form2">
<form name=formMonth>
<table>
<tr>
<td>请输入一月的次数：</td>
<td><input type=text size=10></td>
</tr>
</table>
</form>
</div>
<div id="form3">
<form>
<table>
<tr>
<td>请输入一年的次数：</td>
<td><input type=text size=10></td>
</tr>
</table>
</form>
</div>
<script type="text/javascript">
$d=function(id)
{return document.getElementById(id);}
fhidden($d("form2"),$d("form3"),$d("form1"));
function fhidden(str1,str2,str3)
{
str1.style.display="none";
str2.style.display="none";
str3.style.display="";
}
function changeform(v)
{
switch (v)
{
case "month":fhidden($d("form1"),$d("form3"),$d("form2"));break;
case "year":fhidden($d("form1"),$d("form2"),$d("form3"));break;
default:fhidden($d("form2"),$d("form3"),$d("form1"));break;
}
}
</script>
</body>
</html>