代码之家 › 专栏 › 技术社区 › Anurag

mootools-以编程方式激发的事件不与事件委派一起工作

event-delegation mootools javascript-events javascript

7

Anurag · 技术社区 · 15 年前

如果有人能帮我弄清楚为什么在mootools中使用事件委派(从element.delegation类)时无法以编程方式触发事件,我将不胜感激。

有一位家长 <div> 那有 change 某个孩子的倾听者 <input> 元素。当更改事件由用户操作触发时,父div上的处理程序将被触发,但当我使用 fireEvent 任何子输入都不会发生任何事情。基本设置是:

HTML

<div id="listener">
    <input type="text" id="color" class="color" />
ââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââââ</div>âââââââââââ

JS

$("listener").addEvent("change:relay(.color)", function() {
    alert("changed!!");
});

$("color").fireEvent("change"); // nothing happens

父div上的事件处理程序不会被调用。如有任何帮助,我们将不胜感激。干杯!

相关问题:触发的do事件 焰火 在dom树上泡泡?我现在的黑客是以本机方式发送正在工作的事件(但仍然是一个黑客)- http://jsfiddle.net/SZZ3Z/1/

var event = document.createEvent("HTMLEvents")
event.initEvent("change", true);
document.getElementById("color").dispatchEvent(event); // instead of fireEvent

2 回复 | 直到 12 年前

1

15

Dimitar Christoff 13 年前

这不会起到很好的作用。事件冒泡(以及事件的编程触发)的问题是,它可能需要事件对象是“真实的”,以便它包含 event.target 正在与中继字符串匹配。也, document.id("color").fireEvent() 不会工作,因为颜色本身没有附加事件。

要解决此问题,可以通过传递包含目标元素的事件对象(如下所示)在父侦听器上伪造事件:

document.id("listener").fireEvent("change", {
    target: document.id("color")
});

实际视图: http://www.jsfiddle.net/xZFqp/1/

如果在回调函数中执行event.stop之类的操作,则需要传递 {target: document.id("color"), stop: Function.from} 等等,对于您可能正在引用的任何事件方法,但事件委派代码只对 target 现在。

2

0

Idealmind 12 年前

我是这样解决的:

document.addEvents({
    'click:relay(.remove_curso)': function(){
        document.fireEvent('_remove_curso', this);
    },
    '_remove_curso':function( me ){
        console.log( me );
    }.bind( this )
}