Question

如何使用javascript确定所选下拉选项的值。我不能使用id选择器，所以我尝试使用document.getElementsByClassName。我明白这会返回一组值。这是我尝试使用的简化代码：

<div id="MDL" class="dates">
<p>Select Dates and Price</p>
<select class="datevalue">
    <option value="30">17th July - &pound;30</option>
    <option value="45">17th July - &pound;45</option>
    <option value="70">17th July - &pound;70</option>
    <option value="30">18th July - &pound;30</option>
    <option value="45">18th July - &pound;45</option>
    <option value="70">18th July - &pound;70</option>
</select>
</div>
<input type="button" id="book" VALUE="Buy Now" onClick="book()">

function book() {
var e = document.getElementsByClassName('datevalue');
alert(e.options[.selectedIndex].value);

}

但它不起作用。我已经解决了所有相关问题，所以请不要给我发送其他问题的链接。

Answer 1

要获取HTMLCollection返回的getElementsByClassName中的第一个元素，请使用[0]。然后得到value。

document.getElementsByClassName('datevalue')[0].value

Answer 2

document.getElementsByClassName返回HTMLCollection。即使您只有一个元素，它也是e[0]，而不是e。

Answer 3

如果你的意思是option里面的文字，那么请改用以下代码：

alert(e.options[e.selectedIndex].text);

即。将value更改为text。

如何使用getElementsByClassName确定所选下拉选项的值？

3 个答案: