Question

拥有这段HTML：

<div id="modal">
    <select class="country">
        <option value=""></option>
        <option value="opt">Opt</option>
    </select>
</div>

这篇JS：

$('modal').addEvent('change:relay(.country)', function(){
    console.log(this); // "this" refers to #modal.
}).fireEvent('change:relay(.country)');

日志显示this关键字指的是#modal元素。我想为每个.country select激活事件，并在回调中引用每个。我怎么能拥有它？这是小提琴：http://jsfiddle.net/EWUCG/5/ 非常感谢！

Answer 1

在IRC频道聊天：

事件委托基于事件冒泡。
因此父级内的元素会触发一个事件。然后它将触发其父节点中的事件......
它一直这样做，直到没有更多的父母（窗口）
所以你真的只是设置回调，当其中一个父母收到从孩子那里传来的事件时。

我留下的唯一解决方案是“分别”：

$('modal').addEvent('change:relay(.country)', function(event, target){
    console.log(this, event, target); // Then "this" refers to each .country select.
});
$$('.country').each(function(el){
    $('modal').fireEvent('change', [null, el]);
});

小提琴：http://jsfiddle.net/EWUCG/12/

Answer 2

$$('.country').addEvent('change', function(){

    console.log(this);
    // "this" refers to select

    console.log(this.getElement(':selected'));
    // this.getElement(':selected') refers to selected option

}).fireEvent('change');

Answer 3

这可能就是你所追求的......我在一年前的IRC中选择了这个并且不能告诉你是谁提供的。

http://jsfiddle.net/prbNK/7/

以及用于更好地重用代码的Element方法 - http://jsfiddle.net/prbNK/12/

MooTools事件委托：如何在回调中引用子元素？

3 个答案: