使用表格上的 CheckBox 更改值答案

【问题标题】：Change value using CheckBox on table使用表格上的 CheckBox 更改值
【发布时间】：2020-05-27 12:28:30
【问题描述】：

我有这个 hbs 代码：

<table>
  <tr>
    <th>A</th>
    <th>B</th>    
  </tr>
  {{#each data2}}
  <tr>
    <td>
      <input
      type='checkbox'
      id='nm_produk'
      class='product'
      name='data_{{no}}'
      value="{{no}}">
      <label>{{item}}</label>
    </td>
    <td>
      <input
      disabled type='text'
      placeholder='0'
      name='data_{{no}}'
      id='qtytbs'>
    </td>
  </tr>
  {{/each}}
</table>

还有这个脚本：

$(document).ready(function() {
    $(".product").change(function() {
        $next = $(this).closest('tr').find('[id=qtytb]');
        $next.prop('disabled', !this.checked);   
    });
});

当我选中复选框时，同一行输入元素被启用，我们可以在上面写文本。但是当我取消选中该复选框时，该值仍然存在于最后一个值。当我取消选中复选框元素时，我想在同一行的输入元素上获取空白值并禁用。

我怎样才能做到这一点？

【问题讨论】：

在 HTML 中是 id='qtytbs'> 而在 jquery 中是 find('[id=qtytb]');

标签： jquery html ajax dom

【解决方案1】：

将你的 JS 代码更改为：

$(document).ready(function() {
    $("#nm_produk").change(function() {
        $next = $(this).closest('tr').find('[id=qtytbs]');
        $next.val("");
        $next.prop('disabled', !this.checked);   
    });
});

【讨论】：

【解决方案2】：

添加 $next.val('');仅当复选框被禁用时才添加到您的代码中。您可能需要编写一个 if 条件来设置空值..

【讨论】：

这段代码也可以，但我对如何使用它感到困惑，因为该代码没有配备我拥有的代码......总的来说非常感谢......
我在手机上，当我写这个答案时:)