javascript - 如何获取点击事件的id下拉列表

Question

这是我的jspPage。

<select id="class_Teacher" name="classTeacher" style="height:25px; width: 190px;" onchange="Class(this.id)">
<option id="1">Manager</option>    
<option id="2">Supervisor</option>
</select>

这是javascript

 function Class(str)
{
    alert(str);
}

我想在 onchange 事件中获取 Option 的 id。谢谢 ：）

Answer 1

如果您尝试获取已选择的选项的 ID，则可以执行此操作

function Class(str)
{
    var select = document.getElementById("class_Teacher");
    var option = select.options[select.selectedIndex];
    alert(option.id);
}

Answer 2

您的 onchange 事件将如下所示。只需删除，.id因为这将返回选择框本身的 id 而不是选项

onchange="myFunction(this)"

和你的javascript函数像这样，它会提醒所选选项的ID

function myFunction(ele){
   alert(ele.options[ele.selectedIndex].id);
}

分解ele表示选择框（一个 dom 对象）。.options访问选择框中的选项。[]括号是访问特定选项的一种方式。像一个数组myArr[1]等，并ele.selectedIndex返回一个代表所选选项的数字，即如果选择了第一个选项 -ele.selectedIndex将等效于0.

Answer 3

HTML（你应该使用“value”属性而不是“id”）

<select id="class_Teacher" name="classTeacher" style="height:25px; width: 190px;" onchange="onChange()">
<option id="1" value="ID1">Manager</option>    
<option id="2" value="ID2">Supervisor</option>
</select>

JS

var selectElement = document.getElementById("class_Teacher");
selectElement.onchange=function(){
    alert(selectElement.options[selectElement.selectedIndex].id); // id in the html element
    alert(selectElement.selectedIndex);                           // index starting from 0
    alert(selectElement.value);                                   // value of the selected element
};

小提琴

Answer 4

使用selsectedIndex属性GetElementByID

<script>
    function val() {
        d = document.getElementById("select_id").selectedIndex;
    
        alert(d);
    }
    </script>
 <select onchange="val()" id="select_id">