实现 select中指定option选中触发事件

最新推荐文章于 2022-12-16 09:52:23 发布

转载最新推荐文章于 2022-12-16 09:52:23 发布 · 129 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/mangwusuozhi/p/9460172.html

本文介绍了如何使用JavaScript原生方法及jQuery来获取HTML中Select元素的选中值，包括选中项的索引、value值及文本内容。

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

一,标签中添加onchange属性
‍‍<select id="pid" onchange="gradeChange()">
　　<option grade="1" value="a">选项一</a>
　　<option grade="2" value="b">选项二</a>
</select>
JS:
<script type="text/JavaScript">
　　function gradeChange(){
　　　　var objS = document.getElementById("pid");
　　　　var grade = objS.options[objS.selectedIndex].grade;
　　　　alert(grade);
　　}
</script>
二,js中调用
$("#pid").change(function(){
　　var opt = $("#pid").val();<==>$("#pid option:selected").val();
　　...
});

以下是获取select中某些值的一些方法

一：javascript原生的方法

1:拿到select对象： var myselect=document.getElementById("test");

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

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

4:拿到选中项options的text： myselect.options[index].text;

二：jquery方法（前提是已经加载了jquery库）

1:var options=$("#test option:selected"); //获取选中的项

2:alert(options.val()); //拿到选中项的值

3:alert(options.text()); //拿到选中项的文本

参考转载: http://www.cnblogs.com/itdream/archive/2012/05/31/2528345.html

转载于:https://www.cnblogs.com/mangwusuozhi/p/9460172.html