KnockoutJS:Checkbox内部点击绑定锚标记不可选

时间:2015-07-02 08:10:49

标签: knockout.js javascript-events event-bubbling knockout-3.0

我正在尝试将checked绑定在一个复选框输入上,该输入位于一个锚标记内,该标记本身是click绑定的。

虽然我知道这可能不完全有效(交互式内容可能不是锚标签的后代),但我仍然希望按预期工作 - 即使只是为了理解它。

目前,只处理外部click事件,点击永远不会到达我的复选框。

我想要实现的一个例子是:http://jsfiddle.net/fzmppu93/2/

看了一下KnockoutJS文档,我在锚标记的clickBubble: true绑定上尝试click - 无济于事。

如果您感兴趣,该用例是一个包含链接的无序列表 - 每个链接都是#34;链接"包含电视节目的信息:标题,演员,图像,故事梗概。该节目是可选择的,但也有快速行动'把它标记为看到它,加星标,等等。

是否有另一种方法可以在锚标记中使用复选框?

1 个答案:

答案 0 :(得分:2)

我编写了一个类似于" clickBubble"的自定义绑定处理程序,但是mines允许您阻止任何事件的传播。

这是绑定处理程序:

ko.bindingHandlers.preventBubble = {
        init: function (element, valueAccessor) {
            var eventName = ko.utils.unwrapObservable(valueAccessor());
            var arr = eventName;
            if (!eventName.pop) {
                arr = [arr];
            }
            for (var p in arr) {
                ko.utils.registerEventHandler(element, arr[p], function (event) {
                    event.cancelBubble = true;
                    if (event.stopPropagation) {
                        event.stopPropagation();
                    }
                });
            }
        }
    };

这是你的例子的工作fiddle