如何获取下拉列表选中的值 jquery

分别使用javascript原生的方法和jquery方法

创新互联专注于企业营销型网站、网站重做改版、改则网站定制设计、自适应品牌网站建设、H5网站设计、商城开发、集团公司官网建设、成都外贸网站建设、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为改则等各大城市提供网站开发制作服务。

select id="test" name=""

option value="1"text1/option

option value="2"text2/option

/select

code:

一：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()); //拿到选中项的文本

jquery怎么设置下拉列表被选中

参考以下两种方法：

设置option的selected属性为true

设置select标签的value值为需要选中的值

实例演示如下:

1、根据演示需要，给出一个示例HTML结构

select id="test"

option value="1"option-1/option

option value="2"option-2/option

option value="3"option-3/option

/selectbr

input type="button" id="btn1" value="设置option-2选中"

input type="button" id="btn2" value="设置value=3的项选中"

2、jquery代码

$(function(){

// 方法1：设置option的selected属性为true

$("#btn1").click(function() {  // 第一个按钮单击事件

$("select option").each(function() { // 遍历所有option，如果option内容为option-2，就设置起selected属性为true

if($(this).text()=="option-2")

$(this).prop("selected",true);

});

});

// 方法2：设置select标签的value值为需要选中的值

$("#btn2").click(function() { // 第二个按钮的单击事件

$("select").val("3");  // 设置option值为3的选项选中

});

});

3、效果演示

用jquery怎么判断下拉框选中的值

参考如下代码

$("select").val();  // 选中项目的value值

$("select option:checked").text(); // 选中项目的显示值

示例如下：

1.创建Html元素

请选择：

select id="sel"

option value="1"选项1/option

option value="2"选项2/option

option value="3"选项3/option

option value="4"选项4/option

/select

input type="button" value="点击查看被选项目"

2.编写jquery代码

$(function(){

$("input").click(function() {

a = $("#sel").val();

b = $("#sel option:checked").text();

alert("被选项目的值："+a+"，被选项目的显示值："+b+"。");

});

})

3.显示效果