Question

我有一个foreach循环，它为我提供了多个（大约5个）文件输入元素。

我的表单使用了一个简单的提交按钮，但我希望它没有一个工作（选择时上传）。

我试图让Js或jQuery对点击的任何按钮做出反应而陷入困境。

我的app.set('json spaces', 2)提供了上传按钮：

php

<?php $getCampaign = new Crud(); $query = "SELECT * FROM `table`"; $aRow = $getCampaign->getData($query); if ($aRow == false){ echo '<div class="alert alert-danger">No Campaigns!<br/></div>'; } else { foreach ($aRow as $row) { echo '<div class="row marginBottom">'; echo '<div class="col-sm-2"><strong> '. $row['campaign'] .' </strong></div>'; echo '<div class="col-sm-5"> '. $row['sort'] .'</div>'; echo '<div class="col-sm-5"> <form method="post" enctype="multipart/form-data" action="process-upload-excel.php"> <input type="file" id="' . $row['campaign'] . $row['sort'] .'" class="btn btn-primary btn-sm"> <button type="submit" class="addfile">Upload File!</button> </form>'; echo '</div></div>'; } <hr/> <div id="content"> <div id="response"></div> <ul id="image-list"> </ul> </div>的开始（我到目前为止）：

js

我在数据库中获得了“广告系列”和“排序”。

在这些条目中，我创建了输入文件元素。因此，人们可以为正确的广告系列上传正确的文件。

但是如何在这个例子中使用addEvenListener正确的方法？

我希望有人可以教育我。

提前致谢

Answer 1

您可以使用 delegate 并按照以下方式执行此操作：

<强> HTML

<div id="content">

</div>

<强> JS

// Add two uploaders
for (var i = 1; i <= 2; i++) {
  $('#content').append($('<input type="file" id="uploader' + i + '">'));
}

// Add listener for them
$("#content").delegate("input[type=file]", "change", function() {
  alert($(this).attr("id"));
});

Online demo (Fiddle)

多个输入文件元素上的addEventListener

1 个答案: