Question

如果有人能帮我解决为什么我无法在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上的事件处理程序不会被调用。任何帮助表示赞赏。干杯！

相关问题：DOM树中是否有fireEvent个触发事件？我当前的黑客攻击是本地发送的活动（但仍然是黑客攻击） - http://jsfiddle.net/SZZ3Z/1/

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

Answer 1

这样做不会太好'。事件冒泡（以及事件的编程触发）的问题在于，它可能需要事件对象为“真实”，以使其包含与中继字符串匹配的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}等等你可能引用的任何事件方法，但事件委托代码只对{{1}感兴趣现在。

Answer 2

我这样解决了：

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

MooTools - 以编程方式触发不与事件委派一起使用的事件

HTML

JS

2 个答案: