Javascript如何使第一个select发生onchange事件时，根据选择而显示第二个select选择或者text输入框 5
例子：在第一个select中选择country国家的时候，如果选美国，则出现美国的state(州)select选项；如果选加拿大，则出现加拿大各州的select选项；如果...
例子：在第一个select中选择country国家的时候，如果选美国，则出现美国的state(州) select选项；如果选加拿大，则出现加拿大各州的select选项；如果是其他国家，则出现一个text输入框。代码如下：
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="104" height="22" align="right" >Country:</td>
<td height="22" align="left">
<select name="countryInfo" id="countryInfo" >
<option value="N/A" selected>SELECT</option>
<option value="United States" >United States</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Australia">Australia</option>
<option value="Canada" >Canada</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td height="22" align="right" >State:</td>
<td height="22" align="left">
<select id="StateSelect_US" name="State">
<option value="N/A" selected="selected">美国各州</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="VI">U.S. Virgin Islands</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
<SELECT id="StateSelect_Canada" name="State">
<OPTION value="N/A" selected>加拿大州</OPTION>
<OPTION value="AB">Alberta</OPTION>
<OPTION value="BC">British Columbia</OPTION>
<OPTION value="MB">Manitoba</OPTION>
<OPTION value="NB">New Brunswick</OPTION>
<OPTION value="NF">Newfoundland</OPTION>
</SELECT>
<input name="State" type="text" id="StateText" value="" size="20" />
</td>
</tr>
</table>
很感谢前面两位，但必须按我所要求的内容去写。因为要分别获得一个国家和对应州省的值，但州省的名字虽显示为全称，提交的却必须是缩写的值。而非美国或加拿大的国家，必须手打text填省份。不要纠结为什么非要这样做了，因为很多时候身不由己…… 展开
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="104" height="22" align="right" >Country:</td>
<td height="22" align="left">
<select name="countryInfo" id="countryInfo" >
<option value="N/A" selected>SELECT</option>
<option value="United States" >United States</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Australia">Australia</option>
<option value="Canada" >Canada</option>
<option value="Other">Other</option>
</select>
</td>
</tr>
<tr>
<td height="22" align="right" >State:</td>
<td height="22" align="left">
<select id="StateSelect_US" name="State">
<option value="N/A" selected="selected">美国各州</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="VI">U.S. Virgin Islands</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>
<SELECT id="StateSelect_Canada" name="State">
<OPTION value="N/A" selected>加拿大州</OPTION>
<OPTION value="AB">Alberta</OPTION>
<OPTION value="BC">British Columbia</OPTION>
<OPTION value="MB">Manitoba</OPTION>
<OPTION value="NB">New Brunswick</OPTION>
<OPTION value="NF">Newfoundland</OPTION>
</SELECT>
<input name="State" type="text" id="StateText" value="" size="20" />
</td>
</tr>
</table>
很感谢前面两位，但必须按我所要求的内容去写。因为要分别获得一个国家和对应州省的值，但州省的名字虽显示为全称，提交的却必须是缩写的值。而非美国或加拿大的国家，必须手打text填省份。不要纠结为什么非要这样做了，因为很多时候身不由己…… 展开
4个回答
展开全部
你这样写比叫麻烦，有兴趣的话可以看看这种写法
<!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>无标题文档</title>
<script type="text/javascript">
<!--
var cityList = new Array();
cityList['福建省'] = ['福州市','长乐市','泉州市','厦门市'];
cityList['广东省'] = ['广州市','东莞市','深圳'];
function changeCity(){
var pro = document.getElementById("pro").value;
var city = document.getElementById("city");
city.options.length =0;
for(var i in cityList[pro]){
city.add(new Option(cityList[pro][i],cityList[pro][i]));
}
}
function allcity(){
var pro = document.getElementById("pro");
for(var i in cityList){
pro.add(new Option(i,i));
}
}
window.onload=allcity;
-->
</script>
</head>
<body>
<form action="" method="post" name="myForm">
<select name="pro" id="pro" onchange="changeCity()">
<option>--请选择--</option>
</select>
<select name="city" id="city">
<option>--请选择省份--</option>
</select>
</form>
</body>
</html>
<!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>无标题文档</title>
<script type="text/javascript">
<!--
var cityList = new Array();
cityList['福建省'] = ['福州市','长乐市','泉州市','厦门市'];
cityList['广东省'] = ['广州市','东莞市','深圳'];
function changeCity(){
var pro = document.getElementById("pro").value;
var city = document.getElementById("city");
city.options.length =0;
for(var i in cityList[pro]){
city.add(new Option(cityList[pro][i],cityList[pro][i]));
}
}
function allcity(){
var pro = document.getElementById("pro");
for(var i in cityList){
pro.add(new Option(i,i));
}
}
window.onload=allcity;
-->
</script>
</head>
<body>
<form action="" method="post" name="myForm">
<select name="pro" id="pro" onchange="changeCity()">
<option>--请选择--</option>
</select>
<select name="city" id="city">
<option>--请选择省份--</option>
</select>
</form>
</body>
</html>
追问
很感谢你的回复，但我必须要按所说的规定去做。因为题目出的是别人，而不是自己定的……
追答
那估计要利用display属性，对不同的项来控制不同子项的显隐了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你看看你是不是要的这种效果啊？
参考资料： http://photo.blog.sina.com.cn/photo/8df07b6ftb016a231cae6
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这种技术 叫做三级联动
你最好去网上搜下现成的吧
要不自己写有可能漏点数据
谢谢采纳 请给最佳
你最好去网上搜下现成的吧
要不自己写有可能漏点数据
谢谢采纳 请给最佳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
我不认识英文
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
