[英]Customizing AJAX File Uploader with AJAX Upload
I am trying to use http://valums.com/ajax-upload/ to upload files via AJAX. 我正在尝试使用http://valums.com/ajax-upload/通过AJAX上传文件。 The reason why is because it meets my needs.
原因是因为它满足了我的需求。 However, I need to customize the behavior and I can't figure it out.
但是,我需要自定义行为,我无法弄清楚。 According to the documentation, I should be able to use FileUploaderBasic, but I can't even get an upload button to appear with FileUploaderBasic.
根据文档,我应该能够使用FileUploaderBasic,但是我什至无法使FileUploaderBasic出现上载按钮。 Currently, I'm trying the following:
目前,我正在尝试以下方法:
<div id="file-uploader">
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
</noscript>
</div>
<div id="progressbar" style="width:300px;"></div>
<script type="text/javascript">
$().ready(function () {
var u = new uploader.FileUploaderBasic({
element: document.getElementById('file-uploader'),
action: '/files/upload',
debug: true,
onProgress: function (id, fileName, loaded, total) {
$("#progressbar").progressbar("value", 50);
},
onComplete: function(id, fileName, responseJSON){
$("#progressbar").progressbar("value", 100);
},
});
$("#progressbar").progressbar({
value: 0
});
});
</script>
For each file that is being uploaded, I would like to show a progress bar. 对于每个要上传的文件,我想显示一个进度栏。 to the right of the progress bar, I would like to show the percentage of the upload that has completed.
在进度条的右侧,我想显示已完成上传的百分比。 Below the progress bar, I would like to show the file name and the total size of the file.
在进度条下方,我想显示文件名和文件总大小。 I know the HTML for this is something like the following:
我知道HTML类似于以下内容:
<table border='0' cellpadding='0' cellspacing='0'>
<tr><td rowspan='2'>[img]</td>
<td>[Progress Bar]</td>
<td>[%]</td>
</tr>
<tr><td colspan='2'>[filename] - [filesize]</td></tr>
</table>
I'm just not sure how to accomplish this with FileUploaderBasic. 我只是不确定如何使用FileUploaderBasic完成此操作。 What am I doing wrong?
我究竟做错了什么? I've reached a point of desperation.
我已经到了绝望的地步。 Please help!
请帮忙!
try changing 尝试改变
element: document.getElementById('file-uploader')
to 至
button: document.getElementById('file-uploader')
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.