获取所选下拉列表项的值

Question

晚上好，我的 JSP 中有这些动态生成的下拉列表：`

    <td><select name="model" id="model"  onchange="convertDropDownToTextBox()">

                            <c:forEach items="${model_list}" var="item">

                                <option value="${item.modelId}">${item.modelName}</option>
                            </c:forEach>
                                                            <option value="100">Add New Model</option>

            </select></td>

我尝试使用这些脚本从这些下拉列表中获取选定的值：

function convertDropDownToTextBox(){
    var select = document.getElementById("model");
    var selectedString = select.options[select.selectedIndex].value;
    alert(selectedString);
}

这里的问题是它总是为下拉列表中选择的每个项目提供 1 但是如果我将 onChange 更改为 onchange="alert(this.value)" 它会打印正确的值！那怎么来的？以及如何获取 DropDown 中选择的每个项目的实际索引

Answer 1

只需将event 对象传递给 Endpoint 函数即可：

<select onchange="convertDropDownToTextBox(event)">
    <option value="1">Option 1</option>
</select>

然后您可以从函数中访问值event.target.value：

function convertDropDownToTextBox(e) {
    console.log(e.target.value);
}

Answer 2

不完全确定问题是什么，但这对我有用：

var select = document.getElementById("model");
select.onchange = function(){
    var selectedString = select.options[select.selectedIndex].value;
    alert(selectedString);
}

演示：http://jsfiddle.net/louisbros/PS4zy/1/