使用 JQuery Find 方法在 HTML 表中查找复选框答案

【问题标题】：Find Checkbox in HTML Table Using JQuery Find Method使用 JQuery Find 方法在 HTML 表中查找复选框
【发布时间】：2019-04-02 10:03:16
【问题描述】：

我有一个 HTML 表格，其结构如下：

<table id="myTable">
  <tr>
     <td><input type="text" name="FullName" value="Tom" /></td>
     <td><input type="checkbox" name="isActive" /></td>
     <td><a href="javascript:void(0);" class="edit">Edit</a>
  </tr>
</table>

当用户点击“编辑”链接时，会调用一个 Javascript 函数（见下文）。在这个函数中，我需要从表中获取数据，即 FullName 以及是否检查了 isActive。

 $("#namedTutors").on('click', '.editTutor', function () {
    var tr = $(this).closest("tr");
    var fullName = tr.find("input[name=FullName]").val();
});

我可以很容易地获得 FullName，但我在检索数据以查看 isActive 是否已被检查/勾选时遇到了困难。

有人可以帮忙吗。

谢谢。

【问题讨论】：

tr.find("input[name=FullName]").is(':checked')

标签： javascript jquery html checkbox find

【解决方案1】：

您可以通过名称[name=isActive] 选择复选框输入，然后使用.is(':checked') 来检查复选框是否被选中，例如：

$("#namedTutors").on('click', '.editTutor', function() {
  var tr = $(this).closest("tr");
  var fullName = tr.find("input[name=FullName]").val();
  var isActive = tr.find("input[name=isActive]").is(':checked');
  
  console.log( isActive ); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="namedTutors">
  <tr>
    <td><input type="text" name="FullName" value="Tom" /></td>
    <td><input type="checkbox" name="isActive" /></td>
    <td><a href="javascript:void(0);" class="editTutor">Edit</a>
  </tr>
</table>

【讨论】：

非常感谢您的时间和回答。这有很大帮助。谢谢。

【解决方案2】：

if(tr.find('input[name="isActive"]:checked').length) {
     console.log('it is checked');
}

【讨论】：