在下拉选择菜单中获取所选选项的值

时间:2018-10-26 01:02:00

标签: javascript html

如果我有此html代码段,并希望将所选值存储为js文件中的变量,是否可以?

 <select>
       <option value="a">Not good</option>
       <option value="b">Alright</option>
       <option value="c" selected>Pretty good</option>
       <option value="d">Excellent!</option>
    </select>

我正试图尽可能避免使用jQuery。

3 个答案:

答案 0 :(得分:0)

您只需执行以下操作:

var selectVal = document.getElementsByTagName("select")[0].value;

然后selectValvalue中所选<option>的{​​{1}}。

答案 1 :(得分:0)

var select_element = document.getElementById('select');

select_element.onchange = function() {
    var elem = (typeof this.selectedIndex === "undefined" ? window.event.srcElement : this);
    var value = elem.value || elem.options[elem.selectedIndex].value;
    alert(value);
}
<select id="select">
   <option value="a">Not good</option>
   <option value="b">Alright</option>
   <option value="c" selected>Pretty good</option>
   <option value="d">Excellent!</option>
</select>
<div id="value"></div>

答案 2 :(得分:0)

要获取当前所选选项的价值,可以使用:

var menu = document.getElementById("select_menu_id");

var selected_option = menu.options[menu.selectedIndex].value;

要获取当前所选选项的文本,可以使用:

var selected_option = menu.options[menu.selectedIndex].text;