如何获得select被选中option的value和text

Maybe_ss

于 2019-12-30 10:38:10 发布

阅读量422

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/Maybe_ss/article/details/103762404

前端开发同时被 3 个专栏收录

12 篇文章

订阅专栏

JavaScript

11 篇文章

订阅专栏

jQuery

3 篇文章

订阅专栏

本文介绍如何使用jQuery和原生JS获取HTML Select元素中被选中的option的value和text属性，包括通过jQuery的选择器和原生JS的getElementById及selectedIndex属性实现。

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

如何获得select被选中option的value和text

我想获取select选中的value,text值

比如这个：


  <select name="" id="thought">
                            <option value="" style="display: none;">请选择项目级别</option>
                            <option value="1">国家级</option>
                            <option value="2">省级</option>
                            <option value="3">校级</option>
                           
                        </select>

jQuery方法:

var options=$(“#select option:selected”); //获取选中的项
 
alert(options.val()); //拿到选中项的值
 
alert(options.text()); //拿到选中项的文本
 
alert(options.attr('url')); //拿到选中项的url值

js原生方法

 var myselect=document.getElementById("select");//拿到select对象
 
var index=myselect.selectedIndex ; //拿到选中项的索引
// selectedIndex代表的是你所选中项的index
 
 myselect.options[index].value;//拿到选中项options的value
 
 myselect.options[index].text;//拿到选中项options的text
 
myselect.options[index].getAttribute('url');//拿到选中项的其他值，比如这里的url