Question

我有一个html表，第一列有一个复选框。我想突出显示使用 knockout 检查复选框的行。

<table class="defaultGrid">
<thead>
    <tr>
        <th>Check</th>
        <th>ID</th>
        <th>Name</th>
    </tr>
</thead>
<tbody data-bind="foreach: model.Things">
    <tr>
        <td><input type="checkbox" data-bind="click: $root.selectThing " /></td>
        <td data-bind="text: ID"></td>
        <td data-bind="text: Name"></td>
    </tr>
</tbody>
</table>

以下是关于jsFiddle的示例：http://jsfiddle.net/jJ4H6/1/

我不知道该怎么办。我不想在我的模型上添加额外的属性，如'isSelected'。

有什么想法吗？

感谢。

Answer 1

我肯定会在你的'Thing'中添加一个可以观察到的东西，它可以决定你的tr元素是否有黄色背景。

但是，如果您确实不希望向您的视图模型中添加此类内容，则必须向 selectThing 函数添加一些逻辑来处理这适合你，例如

self.selectThing = function(item, event) {
        $(event.target).parent().parent().addClass('selected');
   };

Answer 2

查看此Jsfiddle http://jsfiddle.net/jJ4H6/27/

 $(function() {
Thing = function(id, name, selected) {
    var self = this;
    self.ID = id, 
    self.Name = name
    self.isChecked = ko.observable(false);
};

function viewModel() {
    var self = this;
    self.model = {};
    self.model.CurrentDisplayThing = ko.observable();
    self.model.Things = ko.observableArray(
        [
            new Thing(1, "Thing 1"),
            new Thing(2, "Thing 2"),
            new Thing(3, "Thing 3")
        ]);
    self.selectThing = function(item) {

    };
}
ko.applyBindings(new viewModel());

}）;

突出显示我的表格的行，其中复选框用knockout检查

2 个答案: