二级联动

最新推荐文章于 2023-04-16 14:47:30 发布

HGG-

最新推荐文章于 2023-04-16 14:47:30 发布

阅读量141

点赞数

分类专栏： web前端

本文链接：https://blog.csdn.net/qq_40959562/article/details/99701874

版权

web前端专栏收录该内容

17 篇文章 0 订阅

订阅专栏

<html>
	<head>
		<title>二级联动</title>
		<meta charset="utf-8"/>
		<script src="js/jquery-3.3.1.js"></script>
		<script>
			function getShi(index){
				//获得市的下拉列表对象
				var shi = document.getElementById("shi");
				if(index!=""){
					//清空原来的市的选项
					//shi.options.length=0;
					$(shi).empty();
				}
				//定义省市二维数组
				var arrs=new Array(3);
				arrs[0]=["杭州市","绍兴市","温州市","义乌市","嘉兴市"];
				arrs[1]=new Array("南京市","苏州市","扬州市","无锡市");
				arrs[2]=new Array("武汉市","襄阳市","荆州市","宜昌市","恩施");
				//arrs[index]代表的是省对应的市的集合
				//arrs[index].length;代表省对应的市的集合的长度
				
				$.each(arrs[index],function(i,n){
					//创建option
					var $option = $("<option>"+n+"</option>");
					$(shi).append($option);
				});
				/*for(var i=0;i<arrs[index].length;i++){
					//创建市的下拉选项(市name,value)
					var option = new Option(arrs[index][i],i);
					shi.add(option);
				}*/
			}
		</script>
	</head>
	
	<body>
		<h1>省市二级联动</h1>
		籍贯：
		<select name="sheng" onchange="getShi(this.value)">
			<option value="">请选择</option>
			<option value="0">浙江省</option>
			<option value="1">江苏省</option>
			<option value="2">湖北省</option>
		</select>
		<select id="shi">
			<option>请选择</option>
		</select>
	</body>
</html>

HGG-

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
二级联动

<html> <head> <title>二级联动</title> <meta charset="utf-8"/> <script src="js/jquery-3.3.1.js"></script> <script> function getShi(index){ //...
复制链接

扫一扫