3

我想有一个与剔除绑定的复选框，这样当我单击周围的 div 时，它会选中该复选框。

下面是我所追求的，但单击事件仅在您单击 div（而不是复选框）时才有效。我认为这是因为单击和实际的复选框选择事件都在发生。

<div class="checkbox-row" data-bind="click: toggleSelected">
    <input type="checkbox" data-bind="checked: selected" />
    <div data-bind="text: title"></div>
</div>

ko.applyBindings(new (function () {
    var self = this;
    self.title = ko.observable('some text');
    self.selected = ko.observable(false);
    self.toggleSelected = function() {
        self.selected(!self.selected());
        return false;
    };
}));

这类似于以下问题：Knockout - How to bind external container css from set of checkboxes?

然而，提出的解决方案是将复选框和内容包装在一个标签中，这可行，但我不想这样做，因为我有相当多的内容可以放入行中，而且标签非常严格。

有没有另一种方法来创建这种行为？

http://jsfiddle.net/BgFe9/

4

1 回答 1

1

一种可能的解决方法（不太好）是在复选框上定义一个“空”点击绑定并设置clickBubble: false.

toggleSelected这将阻止直接单击复选框时调用该方法：

<input type="checkbox" data-bind="checked: selected, 
                                  click: function() { return true; }, 
                                  clickBubble: false" />

演示JSFiddle。

于 2013-07-19T12:22:53.600 回答