我将 FineUploader 应用于一个元素，然后克隆它。新元素将打开文件上传对话框，但不会上传文件。如何实现这一点？
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Testing</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.js" type="text/javascript"></script>
<!-- <script src="/lib/plugins_3rd/fine-uploader-5.2.1/fine-uploader.js" type="text/javascript"></script> -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/file-uploader/3.7.0/fineuploader.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#mytable').find('tr div.upload').each(function(i,v){
console.log(this)
new qq.FineUploaderBasic({
button: this,
request: {
endpoint: 'update.php'
},
});
});
$('#add').click(function(){
$('#clone').clone(true).removeAttr('id').appendTo('#mytable');
});
});
</script>
<style type="text/css">
#clone {display:none;}
</style>
</head>
<body>
<table id="mytable">
<tr id="clone">
<td class="proposal-td">
<div class="upload" title="Upload">
<img src="/lib/templates/back/images/upload.png" alt="Upload">
</div>
</td>
</tr>
<tr>
<td class="proposal-td">
<div class="upload" title="Upload">
<img src="/lib/templates/back/images/upload.png" alt="Upload">
</div>
</td>
</tr>
</table>
<button id="add">Add new</button>
</body>
</html>
最佳答案
克隆的元素需要绑定(bind)到文件上传按钮，因为 this 仅引用该特定元素。您也不需要重复的 HTML 代码。请参阅此工作示例。
HTML
<table id="mytable">
<tr class="row">
<td class="proposal-td">
<div class="upload" title="Upload">Upload</div>
</td>
</tr>
</table>
<button id="add">Add new</button>
JS
function bindUploader($element) {
new qq.FineUploaderBasic({
button: $element[0],
request: {
endpoint: '/echo/json/'
},
callbacks: {
onUpload: function (id, name) {
alert('uploaded');
}
}
});
return $element;
}
$(function () {
bindUploader($('#mytable').find('.upload'));
var $row = $('#mytable .row').clone(true);
$('#add').click(function () {
var $clone = $row.clone(true);
bindUploader($clone.find('.upload'));
$clone.appendTo('#mytable');
});
});
关于javascript - 克隆应用了fineuploader的元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30017286/