时间戳

首页 > 解决方案 > 表格中按钮上的jQuery更改事件

javascript - 表格中按钮上的jQuery更改事件

问题描述

我有一个 html 表或 html 表中的数据网格。每行都有一个不同的用户信息和一个用于将文档上传给该用户的按钮。该表是在 for 循环中构建的。jQuery 总是返回第一行的 id。

如何识别 jquery 更改事件的按钮以读取单击按钮所在行的用户 ID？

或者有没有其他方法可以解决这个问题？请指教。

<tr>
    <td>@u.FirstName</td>
    <td>@u.LastName</td>
    <td>
       <input type="file" class="uploadResume" id="ResDoc" userId="@u.ID" style="display:none" accept="application/pdf" />
       <label for="ResDoc" class="btn btn-info mr-2" style="background-color:#336084;color:white;font-size:12px;">Resume</label>
    </td>
</tr>

标签： javascriptjqueryasp.net-mvcvisual-studio

解决方案

我假设您将有其他列，所以我编写了 jQuery 代码来查找所有恢复按钮并让它们userId在单击时记录它们。代码如下。

var uploadBtns = $(".uploadResume"); // the upload button(s)

uploadBtns.each(function() {
  $(this).click(function() {
    console.log($(this).attr("userId"));
  })
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>@u.FirstName</td>
      <td>@u.LastName</td>
      <td>
        <input type="file" class="uploadResume" id="ResDoc" userId="@u.ID" style="display:none" accept="application/pdf" />
        <label for="ResDoc" class="btn btn-info mr-2" style="background-color:#336084;color:white;font-size:12px;">Resume</label>
      </td>
    </tr>
  </tbody>
</table>

推荐阅读