28,390
社区成员
发帖
与我相关
我的任务
分享如何实现下拉框的级联
如何级联下拉框，例如一个是省一个是市，如何在选择了省以后，第二个下拉框
只有该省所属的所有的城市？？？客户端脚本如何实现。
另外，如何隐藏下拉框？？
只有该省所属的所有的城市？？？客户端脚本如何实现。
另外，如何隐藏下拉框？？
...全文
请发表友善的回复…
发表回复
small_wolf 2000-06-01
- 打赏
- 举报
多谢多谢，你的例子很好。
mxp 2000-06-01
- 打赏
- 举报
用javascript实现！
如：
<html>
<script Language="JavaScript"><!--
function info_option(theForm)
{
if (theForm.infotitle.value == "")
{
alert("标题不能为空！");
theForm.infotitle.focus();
return (false);
}
if (theForm.file_wz.value == "" && theForm.file_wj.value == "")
{
alert("内容和文件不能全为空！");
theForm.file_wz.focus();
return (false);
}
if (theForm.file_wz.value != "" && theForm.file_wj.value != "")
{
alert("内容和文件只能填写一项！");
theForm.file_wz.focus();
return (false);
}
return(true);
}
function chlist(list)
{
var listtext='';
if(list.selectedIndex!=-1)
{
listtext=list.options[list.selectedIndex].value;
}
switch(listtext)
{
case '1':
document.all['mxp1'].style.display="";
document.all['mxp2'].style.display="none";
document.all['mxp3'].style.display="none";
document.all['mxp4'].style.display="none";
break;
case '2':
document.all['mxp1'].style.display="none";
document.all['mxp2'].style.display="";
document.all['mxp3'].style.display="none";
document.all['mxp4'].style.display="none";
break;
case '3':
document.all['mxp1'].style.display="none";
document.all['mxp2'].style.display="none";
document.all['mxp3'].style.display="";
document.all['mxp4'].style.display="none";
break;
}
}
//-->
</script>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>信息录入表</title>
</head>
<body>
<p align="center"><b><font color="#800000" size="5">信息录入表</font></b></p>
<hr>
<form method="POST" action=info_write.ASP?WCI=info&WCE=add onSubmit="return info_option(this)" name="fileinput" ENCTYPE="multipart/form-data">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td width="656">类型：<select size="1" name="file_type">
<option Value=1 selected>周工作安排 </option>
<option Value=2 >周工作通知</option>
<option Value=3 >周工作信息 </option>
</select> </td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:" >
<tr>
<td width="100%"> 级别：<select size="1" name="fiel_level" onchange="chlist(this);">
<option Value=1 selected>处室级 </option>
<option Value=2>年部级</option>
<option Value=3>学科级 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:" ID=mxp1>
<tr>
<td width="100%"> 处室：<select size="1" name="cs">
<option Value=1 selected>校长办</option>
<option Value=2 >书记办 </option>
<option Value=3 >教务处</option>
<option Value=4 >德育处 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:none" ID=mxp2>
<tr>
<td width="100%"> 年部：<select size="1" name="grade">
<option Value=1 >9801 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:none" ID=mxp3>
<tr>
<td width="100%"> 学科：<select size="1" name="dept">
<option Value=001 selected>数学</option>
<option Value=002>语文</option>
</select></td>
</tr>
</table>
<hr>
<p align="left">标题：<input type="text" name="infotitle" size="76"></p>
<p align="left">内容：</p>
<p align="left"><textarea rows="5" name="file_wz" cols="81"></textarea></p>
<p align="left">上传文件：<input type="file" name="file_wj" size="62"></p>
<p align="center"><input type="submit" value="提交" name="tj">
<input type="reset" value="重写" name="cx"></p>
</form>
</body>
</html>
如：
<html>
<script Language="JavaScript"><!--
function info_option(theForm)
{
if (theForm.infotitle.value == "")
{
alert("标题不能为空！");
theForm.infotitle.focus();
return (false);
}
if (theForm.file_wz.value == "" && theForm.file_wj.value == "")
{
alert("内容和文件不能全为空！");
theForm.file_wz.focus();
return (false);
}
if (theForm.file_wz.value != "" && theForm.file_wj.value != "")
{
alert("内容和文件只能填写一项！");
theForm.file_wz.focus();
return (false);
}
return(true);
}
function chlist(list)
{
var listtext='';
if(list.selectedIndex!=-1)
{
listtext=list.options[list.selectedIndex].value;
}
switch(listtext)
{
case '1':
document.all['mxp1'].style.display="";
document.all['mxp2'].style.display="none";
document.all['mxp3'].style.display="none";
document.all['mxp4'].style.display="none";
break;
case '2':
document.all['mxp1'].style.display="none";
document.all['mxp2'].style.display="";
document.all['mxp3'].style.display="none";
document.all['mxp4'].style.display="none";
break;
case '3':
document.all['mxp1'].style.display="none";
document.all['mxp2'].style.display="none";
document.all['mxp3'].style.display="";
document.all['mxp4'].style.display="none";
break;
}
}
//-->
</script>
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>信息录入表</title>
</head>
<body>
<p align="center"><b><font color="#800000" size="5">信息录入表</font></b></p>
<hr>
<form method="POST" action=info_write.ASP?WCI=info&WCE=add onSubmit="return info_option(this)" name="fileinput" ENCTYPE="multipart/form-data">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td width="656">类型：<select size="1" name="file_type">
<option Value=1 selected>周工作安排 </option>
<option Value=2 >周工作通知</option>
<option Value=3 >周工作信息 </option>
</select> </td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:" >
<tr>
<td width="100%"> 级别：<select size="1" name="fiel_level" onchange="chlist(this);">
<option Value=1 selected>处室级 </option>
<option Value=2>年部级</option>
<option Value=3>学科级 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:" ID=mxp1>
<tr>
<td width="100%"> 处室：<select size="1" name="cs">
<option Value=1 selected>校长办</option>
<option Value=2 >书记办 </option>
<option Value=3 >教务处</option>
<option Value=4 >德育处 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:none" ID=mxp2>
<tr>
<td width="100%"> 年部：<select size="1" name="grade">
<option Value=1 >9801 </option>
</select></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="display:none" ID=mxp3>
<tr>
<td width="100%"> 学科：<select size="1" name="dept">
<option Value=001 selected>数学</option>
<option Value=002>语文</option>
</select></td>
</tr>
</table>
<hr>
<p align="left">标题：<input type="text" name="infotitle" size="76"></p>
<p align="left">内容：</p>
<p align="left"><textarea rows="5" name="file_wz" cols="81"></textarea></p>
<p align="left">上传文件：<input type="file" name="file_wj" size="62"></p>
<p align="center"><input type="submit" value="提交" name="tj">
<input type="reset" value="重写" name="cx"></p>
</form>
</body>
</html>
