使用时,为防止事件冒泡在knockoutjs检查的结合(Prevent event bubbling

2019-07-18 04:58发布

我建设使用KnockoutJs和Twitter的引导的UI。

我使用的checked称为引导对话中结合dropdown-toggle

<div class="btn-group">
    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
        Facets
        <span class="caret"></span>
    </a>
    <ul class="dropdown-menu">
        <!-- ko foreach: facets -->
        <li>
            <input type="checkbox" data-bind="checked: Visible" /> 
            <span data-bind="text: Name"></span>
        </li>
        <!-- /ko -->
    </ul>
</div>

一切都很好,只是我想下拉对话检查复选框时保持开放。

下面是一个例子的小提琴: http://jsfiddle.net/MikeEast/L3KfG/2/

我曾尝试创建它使用与检查明确绑定在一起我自己装订处理器event.preventDefault()event.stopPropagation()这让开了对话,但防止被检查的复选框。

任何指针?

Answer 1:

这听起来像你在正确的轨道上。 基本上,你想要做的相当于:

click: function() { return true; }, clickBubble: false

否则 ,可能在使用自定义的结合来完成:

ko.bindingHandlers.stopBubble = {
  init: function(element) {
    ko.utils.registerEventHandler(element, "click", function(event) {
         event.cancelBubble = true;
         if (event.stopPropagation) {
            event.stopPropagation(); 
         }
    });
  }
};

除非你返回true由KO连接正常点击/事件处理程序将阻止默认动作。 然而,如果我们连上我们自己的事件处理程序,那么我们只需要以防止起泡。

示例: http://jsfiddle.net/MikeEast/PyNfg/1/



文章来源: Prevent event bubbling when using the checked binding in knockoutjs
标签: knockout.js