我有一个这样的下拉列表:

<select id="box1">
<option value="98">dog</option>
<option value="7122">cat</option>
<option value="142">bird</option>
</select>

我如何才能获得实际的选项文本,而不是使用JavaScript的值?我可以通过如下方式获取值:

<select id="box1" onChange="myNewFunction(this.selectedIndex);" >

但我想要猫而不是7122。


当前回答

ECMAScript 6 +。

const select = document.querySelector("#box1");

const { text } = [...select.options].find((option) => option.selected);

其他回答

试试下面的方法:

myNewFunction = function(id, index) {
    var selection = document.getElementById(id);
    alert(selection.options[index].innerHTML);
};

请看这里的jsfiddle示例

所有这些函数和随机的东西,我认为最好使用这个,像这样做:

this.options[this.selectedIndex].text
var selectionlist=document.getElementById("agents"); td2.innerHTML = selectionlist.children[selectionlist.selectedIndex].innerHTML;

函数runCode() { var value = document.querySelector('#Country').value; window.alert(文档。querySelector(#国家选项(value = $ {value}]) .innerText); } <select name="Country" id="Country"> 印度<选项值= " " > < /选项> <option value="GBR">United Kingdom </option> . " /option> . <option value="USA">美国</option> <option value="URY">乌拉圭</option> . <option value="UZB">乌兹别克斯坦</option> < /选择> <按钮onclick = " runCode ()按钮“> < / >

使用jquery。 在你看来

  let selText = $("#box1 option:selected").text();
  console.log(selText);