我正在尝试使用Fineuploader S3从客户端直接上传到亚马逊。我引用了以下文件:
s3.jquery.fineuploader-4.4.0.min.js
我正在使用默认模板:
<div id="fineUploader"></div>
<script type="text/template" id="qq-template">
<div class="qq-uploader-selector qq-uploader">
<div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
<span>Drop files here to upload</span>
</div>
<div class="qq-upload-button-selector qq-upload-button">
<div>Browse...</div>
</div>
<span class="qq-drop-processing-selector qq-drop-processing">
<span>Processing dropped files...</span>
<span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
</span>
<ul class="qq-upload-list-selector qq-upload-list">
<li>
<div class="qq-progress-bar-container-selector">
<div class="qq-progress-bar-selector qq-progress-bar"></div>
</div>
<span class="qq-upload-spinner-selector qq-upload-spinner"></span>
<span class="qq-edit-filename-icon-selector qq-edit-filename-icon"></span>
<span class="qq-upload-file-selector qq-upload-file"></span>
<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text">
<span class="qq-upload-size-selector qq-upload-size"></span>
<a class="qq-upload-cancel-selector qq-upload-cancel" href="#">Cancel</a>
<a class="qq-upload-retry-selector qq-upload-retry" href="#">Retry</a>
<a class="qq-upload-delete-selector qq-upload-delete" href="#">Delete</a>
<span class="qq-upload-status-text-selector qq-upload-status-text"></span>
</li>
</ul>
</div>
</script>
并像这样初始化:
$('#fineUploader').fineUploaderS3({
debug: true,
autoUpload: true,
request: {
endpoint: "http://mybucket.s3.amazonaws.com",
accessKey: "MY_AWS_PUBLIC_ACCESS_KEY"//,
//params: { category: "foobar" }
},
signature: {
endpoint: "/s3/signtureHandler"
},
uploadSuccess: {
endpoint: "/s3/uploadSuccessful"
}, // etc etc etc.
该脚本似乎有效,因为我看到一个"浏览"按钮,该按钮可让您使用文件对话框选择文件。但是一旦我选择一个文件并单击"打开",就没有任何反应。我以为它会尝试开始上传,但它只是关闭了文件对话框。
我在这里错过了什么吗?我需要做什么才能上传文件?
谢谢!
编辑:这是浏览器控制台的输出:
[精细上传 4.4.0] 解析模板
[精细上传器 4.4.0]模板解析完成
[精细上传器 4.4.0]DOM
中的渲染模板[精细上传器 4.4.0]模板渲染完成
event.returnValue 已弃用。请改用标准 event.preventDefault()。(jquery-1.10.2.js:5388)
嗯,我似乎已经想通了。似乎不知何故,来自 FineUploader 的事件并没有通过我的 DOM 冒泡。这是因为我在 Knockout JS "with" 绑定中有一个上传按钮,我猜这是在幕后交换 DOM 元素。摆脱"with"绑定解决了这个问题。
非常感谢大家的帮助!非常感谢!