javascript - 选中复选框时更改 tr 颜色

Question

我创建了如下表：

<table data-bind="with: choosenDateGoal">                       
   <tbody data-bind="foreach: tblGoals">
      <!-- ko if: status -->
         <tr class="success">
          <td>
            <input type="checkbox" onclick="this.disabled = 'disabled';" data-bind="checked: status, disable: status, click: $root.UpdateStatus" />
           </td>
          <td>
           <span style="width: 80%" data-bind="text: goals" />
           </td>
           <td>
           <input type="text" style="width: 80%" data-bind="value: notes , event: { blur: $root.UpdateNote}" />
           </td>
           </tr>
          <!-- /ko -->

           </tbody>
    </table>

我在每一行都有一个复选框，当我点击它时，它应该改变行颜色。但不工作。这是我改变颜色的脚本：

self.UpdateColor = function ChangeBackgroundColor() {
    debugger;
    if ($("input[type='checkbox']:checked")) {
        $(this).parent().addClass('success'); ;
    }
};

Answer 1

使用 knockout 的 css 绑定 - 请参阅http://knockoutjs.com/documentation/css-binding.html 尝试下面的绑定，您不会调用 ChangeBackgroundColor 函数

  <tr data-bind="css: {success: status()}">

Zaik 的答案会起作用，但如果你用淘汰赛的方式来做，你不需要添加任何 JavaScript 事件代码。这是淘汰赛的真正好处之一。