events - knockout : prevent event bubbling for elements with no handler

Question

好像绑定(bind) <event>Bubble: false仅当有 a defined event handler 时才有效(见注 4)<event> .

这是一个示例 fiddle .

对于具有某些事件的 native 处理程序的元素(例如单击:<textarea>、<a>、<select> 等)，如果 native 处理程序就足够了，我希望设置绑定(bind)，例如 clickBubble: false在他们身上，无需绑定(bind)“虚假”处理程序即可工作。

我想我的问题是，是否有另一种 knockout 方法可以在没有额外绑定(bind)的情况下实现这一目标？

Answer 1

Bubble处理程序不是实际的绑定(bind)处理程序，而是用作 event 中的选项。绑定(bind)(click 绑定(bind)调用 event 绑定(bind))。因此，它们不会自行运行。

因此，您可以添加一个“伪造的”无操作处理程序并使用 clickBubble或者您当然可以选择创建一个自定义绑定(bind)来为您执行此操作。

也许是这样的:

ko.bindingHandlers.preventBubble = {
    init: function(element, valueAccessor) {
        var eventName = ko.utils.unwrapObservable(valueAccessor());
        ko.utils.registerEventHandler(element, eventName, function(event) {
           event.cancelBubble = true;
           if (event.stopPropagation) {
                event.stopPropagation();
           }                
        });
    }        
};

然后放:

<input data-bind="preventBubble: 'click'" />

如有必要，您还可以进一步增强它以接受一系列事件。

sample : http://jsfiddle.net/rniemeyer/WcXwZ/