Question

我有一个通过ajax调用填充的表，因此它有n行。

每行中的一列有一个上传文档的按钮。

由于该行是动态的，因此该按钮在每一行上都具有相同的ID。问题是，我试图获取每一行的文件，但不能这样做因为getElementById不起作用（因为有多个元素具有相同的ID因为有多行） - 它总是只是选择顶行。

如果我执行以下操作，我可以获得有关该文件的一些信息，但不能获取文件本身（因为我无法弄清楚如何获取实际的HTML）：

$('#TableName tbody').on('change', '#uploadFile', function () {
        var file = $(this).closest('tr').find("input[id='uploadFile']")

我可以使用file [0] .value获取文件名，但我无法获取实际的HTML，因此也无法获取文件。

有没有办法真正获取html，因此每行使用相同的ID？如果没有，是否有办法为每一行使用不同的ID？

非常感谢任何帮助！

P.S。使用javascript / jquery

Answer 1

在HTML中，每个ID都必须是唯一的。您不能在每一行使用相同的id，即HTML无效。

相反，使用class;如果在您之前使用id替换HTML中的所有class：

<tr>
  <input id="uploadFile">
</tr>

您应该将其替换为：

<tr>
  <input class="uploadFile">
</tr>

然后您可以使用以下方法匹配该类的元素：

$('#TableName tbody').on('change', '.uploadFile', function () {
    var file = $(this).closest('tr').find("input.uploadFile]")

Answer 2

好吧最终让它发挥作用。

将其更改为类，获取click的当前行索引，执行documents.getElementsByClassName，最后选择具有该索引的行。

感谢您的帮助！