如何停止`click`冒泡通过手风琴标题中的输入元素来避免激活手风琴元素

时间:2015-06-01 19:13:09

标签: javascript jquery knockout.js accordion

我在手风琴标题中有一个带有<input>的jQuery手风琴。 手风琴是“可折叠的”,但是当我在<input>内点击时,我不希望该项目展开(或折叠)。

如何阻止click事件冒泡<input>元素以避免激活手风琴元素?

是否有一些聪明的方式将event.stopPropagation();(或类似的东西)应用于手风琴beforeActivate - 回调? 或者这可以直接在<input>的数据绑定上完成吗?

来自我的bindingHandler:

       $(element).accordion({
            header: ".accordion-header",
            collapsible: true,
            navigation: true,
            heightStyle: "content",
            active: false,

            beforeActivate: function (event, ui) {
                active = $(this).accordion("option", "active");
            },
            activate: function (event, ui) {
                event.stopPropagation(); // This obviously has no effect
            }
        })

1 个答案:

答案 0 :(得分:3)

你做对了.stopPropagation()是正确的,你只是没有在正确的位置,它会进入输入的点击处理程序。

离。

$(document).on('click', '.my-input', function(e){
     e.preventDefault();   // throw this in for good measures too
     e.stopPropigation();

    //  your code to handle click here
});

HTML

<input data-bind="click: clickHandler" />

淘汰赛:

clickHandler = function(e){
        e.preventDefault();   // throw this in for good measures too
        e.stopPropigation();
};