javascript - 启用复选框

Question

我有以下代码，询问该工具是否被占用，如果该工具被占用，则复选框被禁用，否则启用。

但是我有一个 javascript，我可以用库 /x-editable 更改工具。 当我更改成功函数中的工具时，我希望启用该行的复选框。我有一个代码，但它的作用是启用所有复选框。

var tools = [];
        $.each({
            "tools1": "tools1",
            "tools2": "tools2",
            "tools3": "tools3",
            "tools4": "tools4"
        }, function(k, v) { tools.push({value: k, text: v});
        });

$('#table').editable({
        container: 'body',
        selector: 'td.Tools',
        title: 'new Tools',
        source: tools,
        showbuttons: false,
        success: function(response) {
          
        $('.form-check-input').closest('tr').find('input[name=choose]').attr('disabled', false);

        }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>
<table id="table" class="table table-bordered" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Id
            </th>
            <th>Tools
            </th>
            <th>
            </th>
        </tr>
    </thead>
    <tbody>
      <tr>
        <td data-name="id" class="id" data-type="text"> 
          2
        </td>
        <td data-name="Tools" class="editable Tools" data-type="select">
          Tools1
        </td>
        <td>
          <input type="checkbox" name="choose" id="btn1" class="form-check-input" data-toggle="tooltip" disabled>Choose
        </td>
      </tr>
      <tr>
       <td data-name="id" class="id" data-type="text"> 
          1
        </td>
        <td data-name="Tools" class="editable Tools" data-type="select">
         Tools3
        </td>
        <td>
          <input type="checkbox" name="choose" id="btn2" class="form-check-input" data-toggle="tooltip" disabled>Choose
        </td>
      </tr>
      <tr>
          <td data-name="id" class="id" data-type="text"> 
          3
        </td>
        <td data-name="Tools" class="editable Tools" data-type="select">
         Tools4
        </td>
        <td>
          <input type="checkbox" name="choose" id="btn3" class="form-check-input" data-toggle="tooltip">Choose
        </td>
      </tr>
    </tbody>
</table>

我希望我解释得很好

Answer 1

$('.form-check-input').closest('tr').find('input[name=choose]').attr('disabled', false);

这行代码使用 form-check-input 类启用距离每个元素最近的复选框

如果您只想启用正在处理的复选框，您应该执行类似 $(this).closest('tr').find('input[name=choose]') 的操作。 attr('禁用', false);

希望这有帮助