jQuery，如何获取表行中特定复选框的值？

我有多行的表，但它的行包含3个复选框和按钮。现在，我想更新关于这个按钮和复选框的db表。但是，问题是当我单击每个行按钮时，无法获取复选框的值。请查找下面的代码，并让我知道如何根据每行上的按钮获取值

<table width="100%">
  <tr class="tbrow">
    <td width="12%">
      <span class="name">test.html</span>
    </td>
    <input type="hidden" value="0" class="file_id" />
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="read" title="read" /> Read
      </span>
    </td>
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="write" title="write" /> Write
      </span>
    </td>
    <td width="7%">
      <span class="action">
        <input type="checkbox" value="1" class="download" title="download" /> Download
      </span>
    </td>
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="share" title="share" /> Share
      </span>
    </td>
    <td width="80%">
      <span class="action">
        <input type="submit" name="assign" class="assign" title="Submit" value="Submit" />
      </span>
    </td>
  </tr>
  <tr class="tbrow">
    <td width="12%">
      <span class="name">testing.doc</span>
    </td>
    <input type="hidden" value="1" class="file_id" />
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="read" title="read" /> Read
      </span>
    </td>
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="write" title="write" /> Write
      </span>
    </td>
    <td width="7%">
      <span class="action">
        <input type="checkbox" value="1" class="download" title="download" /> Download
      </span>
    </td>
    <td width="5%">
      <span class="action">
        <input type="checkbox" value="1" class="share" title="share" /> Share
      </span>
    </td>
    <td width="80%">
      <span class="action">
        <input type="submit" name="assign" class="assign" title="Submit" value="Submit" />
      </span>
    </td>
  </tr>
</table>

test.html
阅读
写
下载
分享
testing.doc
阅读
写
下载
分享

现在，当我单击第一行的“读取”复选框并单击“提交”时，它将拾取该值以及class=“file\u id”值的隐藏值

类似地，当我单击第二行中的submit时，它应该只拾取第二行中的复选框值，反之亦然

请检查代码并帮助我

提前感谢您抽出时间

谢谢！

---

Robin

复选框的值在未选中时设置为null，在选中时设置为“开”，您需要在服务器端放置一些逻辑来处理它，因为如果您提交，您将有一个类似“1”的值：“开”

---

将值更改为“read”“write”等，并在其不为null时使用它

您可以使用此jQuery代码查找对应于特定单击按钮和文件id的复选框类别：

$('.assign').click(function(){
   console.log($(this).closest('tr').find('.file_id').val());

    $(this).closest('tr').find('input[type=checkbox]:checked').each(function(){
    console.log($(this).attr('class'));
    });
});

---

您可以按任何方式使用类和文件id。

在事件处理程序中

此

指触发事件的元素。使用当前元素可以遍历到重复元素的最高级别，在这种情况下，它将是

，然后在该主元素中进行所有后续搜索

$('.assign').click(function(){
   var $row = $(this).closest('tr');
   var thisRowFileID = $row.find('.file_id').val(); 
   var thisRowCheckedCheckboxs = $row.find(':checkbox:checked');
    /* do something with collection of checked checkboxes*/
});

---

使用此代码

• 工作演示在这里

---

您还可以发布jQuery代码并选中几个复选框吗？所有的值都设置为“1”，难道你不需要其他东西，比如标题吗？@RobindraSingha-看到答案了吗-我更新了这不算答案。这样的建议应该放在评论中。这个概念并不完全准确。在DOM中，无论处于何种选中状态，复选框都具有值。我相信您正在考虑的表单提交与OP issues@RobindraSingha不同-如果答案对您有用-给予

upvote

和

接受它。它将帮助其他人找到正确的解决方案。
$(function () {
    $(".assign").click(function(){

        var chk = $(this).closest('tr').find('input:checkbox'); 
        var fileid=$(this).closest('tr').find('.file_id').val();
        alert("File ID : " +fileid);
        alert("read :" +chk[0].checked);
        alert("Write: " +chk[1].checked);
        alert("Download: "+ chk[2].checked);

    });
});