Skip to main content

JS获取select下拉框选择菜单选中的值

开发的时候使用jquery的时候遇到了一个IE不兼容的问题。 我是这么获取的:

var obj = $('select[name="box_product_list"] option:selected');
console.log(obj.val()+' '+obj.html());
var id = obj.val();
var name = obj.html();
alert(id + ' ' + name);

火狐和谷歌浏览器都通过,只有ie不行。用的IE9。有时候行,有时候不行。 然后就用原生的js来解决这个问题了。

var myselect=document.getElementById("box_product_list");
var index = myselect.selectedIndex ;
var id = myselect.options[index].value;
var name = myselect.options[index].text;

下面是找的博文thank you 嘿嘿

现在有一id=test的下拉框,怎么拿到选中的那个值呢?

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

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