禁用儿童事件

Question

我正在使用Ext JS 4.我在容器内有一个按钮。我希望容器接收鼠标悬停，鼠标移动和单击事件，但该按钮导致鼠标悬停和mouseout事件处理程序在容器上被调用两次。如何禁用子按钮上的事件？

Answer 1

我相信你正在运行4.0的新bubbleWvents行为。组件现在将一些事件传播到其父容器。这种情况发生在代码中，独立于DOM事件冒泡，在组件层次结构中。

http://dev.sencha.com/deploy/ext-4.0.0/docs/api/Ext.container.Container.html

最好的解决方法是在处理完事件后立即停止。这应该可以防止所有冒泡，组件或DOM。对点击事件执行此操作通常是个好主意，以确保响应点击时只发生一件事，但我不太确定它适合鼠标悬停和鼠标移出。

panel.on('click', function(e) {
    e.stopEvent();
    // do your stuff
});

你可以尝试的其他修复（我没有）是在按钮上擦除bubbleEvents。

另一个可能不那么强大的修复方法是打开事件缓冲：

el.on('click', this.onClick, this, {buffer: 10});

缓冲在一个可配置的时间窗口中将重复事件折叠成一个，它对于平滑快速激活或重复的UI事件非常有用，但我不确定它是如何与冒泡一起播放的。

Answer 2

{
...
preventDefault: true,
...
}