js中怎么获得本页下拉菜单选定的值

Posted 2023-03-09

首先设置下拉列表控件的id属性
<select id="test" name="">
<option value="1">text1</option>
<option value="2">text2</option>
</select>
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()); //拿到选中项的文本 参考技术A <select id = "cityList" >
<select id = "selectId" >
<option value = "0">第0个</option>
</select>

<script>
var selectObj = document.getElementById('selectId');
// 通过对象添加option
selectId.add(new Option("第一个","1"))
selectId.add(new Option("第二个","2"))
// 通过id添加option
selectId.add(new Option("第三个","3"))
selectId.add(new Option("第四个","4"))
// 通过id添加方法（也可以通过对象添加方法）
selectId.onchange = function()
// 通过对象获取value和text
alert(selectObj.value);
alert(selectObj.options[selectObj.selectedIndex].text);
// 通过 id 获取value和text
alert(selectId.value);
alert(selectId.options[selectId.selectedIndex].text);
// 还可以通过this获取value和text
alert(this.value);
alert(this.options[this.selectedIndex].text);
;
</script>