多级联动，下拉列表取text及value值的两种方法（传统方法+JQuery方法）

原创于 2017-08-29 16:44:12 发布 · 915 阅读

0 ·

CC 4.0 BY-SA版权

jsp 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一个使用JavaScript实现的下拉框联动效果示例。通过获取select元素及其选项的值和文本，实现了县级区域的选择变化。适用于单级或多级联动场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

			//县级改变，取文本及value值
			$("#s3").change(function (){
// 			  1:拿到select对象： 
			  var  myselect=document.getElementById("s3");

// 			  2：拿到选中项的索引：
			  var index=myselect.selectedIndex ;  // selectedIndex代表的是你所选中项的index

// 			  3:拿到选中项options的value：  
			  var aa=myselect.options[index].value;

// 			  4:拿到选中项options的text：  
			  var bb=myselect.options[index].text;
				alert(aa)
				alert(bb)
				
// 				在此处，下列方法适用于单一下拉列表，
// 				多级联动的，每个select被选中的text值都会取一次，数据库字段不太合适，
// 				【省：湖北省】【市：湖北省武汉市】【县：湖北省武汉市xxx县】
// 				alert($('select option:selected').val());
// 				alert($('select option:selected').text());
				
			})