<select> 上的更改事件

【问题标题】：Change event on <select><select> 上的更改事件
【发布时间】：2010-03-17 09:03:46
【问题描述】：

使用 Mootools，如果我在 <select> 上附加更改事件侦听器，我如何访问已选择的选项。我想要实际的元素，而不仅仅是值。

$('select').addEvent('change',function(event) {
    //??
});

【问题讨论】：

【解决方案1】：

以下任何一种都可以：

在后代中查找 :selected 伪选择器

this.getElement(':selected');

获取第一个选择的值

this.getSelected()[0];

纯 javascript，使用 selectedIndex 属性

this.options[this.selectedIndex];

【讨论】：

【解决方案2】：

只需访问选择元素上的selectedIndex 属性（事件处理程序中的this 对象）即可获取选项索引。

// get the index of the selected option
var index = this.selectedIndex;

// get the option element
var opt   = this.options[index];

【讨论】：

【解决方案3】：

event.target.id 是对象

event.target.value 是新值

【讨论】：