當(dāng)前位置：首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

选择省份时，自动显示对应省份的城市

發(fā)布時(shí)間：2025/3/15 编程问答 23 豆豆

生活随笔收集整理的這篇文章主要介紹了选择省份时，自动显示对应省份的城市小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

? 在很多網(wǎng)頁(yè)中，都會(huì)有讓用戶選擇城市的選項(xiàng)，那么，就需要我們用js來(lái)實(shí)現(xiàn)，當(dāng)用戶選擇了省份，自動(dòng)選擇對(duì)應(yīng)省份的城市。

<head>
?	<title></title>
?	<meta http-equiv="content" content="text/html" charset="utf-8"/>
?	<script type="text/javascript">
?	var citys =[ ]; ? ? ? ? ? ? ? ? ? ? ? ? ? ??// 定義一個(gè)變量來(lái)保存省份和城市
?	citys["四川"]=["成都","綿陽(yáng)"];
?	citys["湖南"]=["岳陽(yáng)","長(zhǎng)沙"];
?	citys["廣東"]=["深圳","廣州"];
?	var selects;
?	?
?	?
?	?
?	window.οnlοad=function( ){
?	selects = document.forms[0].elements; ? ? ? ? ? ???// 先找到第一個(gè)form對(duì)象
?	for(var a in citys){
?	selects[0].add(new Option(a,a),null);
?	}
?	fun()
?	}
?	?
?	?
?	function fun(){
?	selects[1].length=0;
?	var option=selects[0].options[selects[0].selectedIndex];
?	var city=citys[option.text];
?	for(var i=0;i<city.length;i++){
?	selects[1].add(new Option(city[i],city[i]),null);
?	}
?	}
?	</script>
?	?
?	</head>
?	?
?	<body>
?	<form>
?	<select οnclick="fun()"></select> ? ? ? ? ? // 定義一個(gè)各省份的選擇框
?	<select></select> ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?//定義一個(gè)對(duì)應(yīng)省份所在市的選擇框
?	</form>
?	</body>
?	</html>

? ? ? ? 首先用js實(shí)現(xiàn)當(dāng)用戶點(diǎn)擊第一個(gè)的時(shí)候，對(duì)應(yīng)的選擇框進(jìn)行城市的跳轉(zhuǎn)，并清除之前選擇的城市。

? ? 學(xué)習(xí)js重要的是在堅(jiān)持，雖然，開(kāi)始接觸的時(shí)候，都覺(jué)得挺難的，但要理解實(shí)現(xiàn)的功能和每段代碼所要實(shí)現(xiàn)的功能。

轉(zhuǎn)載于:https://www.cnblogs.com/liner730/p/4541518.html

以上是生活随笔為你收集整理的选择省份时，自动显示对应省份的城市的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。