我想添加第二个上传按钮,专门在iOS设备上调用相机。
根据recent blog post,我了解这可以使用addFiles()
方法完成。但是我的项目目前正在使用JQuery版本的FineUploader.
我可以从JQuery版本访问addFiles()
还是应该切换到Vanilla JS版本?
答案 0 :(得分:2)
使用jQuery插件时,您可以访问任何API方法。以addFiles
为例:
$('#myUploader').fineUploader('addFiles', filesOrInputs);
filesOrInputs
可以是File
,<input type="file">
或数组(或类似数组的结构)。
请参阅"Using the jQuery plug-in" readme或了解详情。
答案 1 :(得分:1)
我已经实施了这个解决方案:
<body>
<div id="restricted-fine-uploader"></div>
<div id="cameraButtonContainer" class="qq-upload-button" style="position: relative; direction: ltr;">
<div>or click here</div>
<input id="cameraButton" type="file" name="camera" accept="image/*;capture=camera" style="position: absolute; right: 0px; top: 0px; font-family: Arial; font-size: 118px; margin: 0px; padding: 0px; cursor: pointer; opacity: 0;"
onchange="$('#restricted-fine-uploader').fineUploader('addFiles', this); ">
</div>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(function($) {
$("#restricted-fine-uploader").fineUploader({
request: {
endpoint: "janka/upload"
},
deleteFile: {
enabled: true,
forceConfirm: true,
endpoint: "janka/delete"
},
chunking: {
enabled: true
},
resume: {
enabled: true
},
multiple: true,
element: document.getElementById("restricted-fine-uploader"),
validation: {
allowedExtensions: ["jpeg", "jpg", "png"],
sizeLimit: 5 * 1024 * 1024 // 5 MB
},
text: {
uploadButton: "Drop image here"
},
showMessage: function(message) {
$("#restricted-fine-uploader").append("<div class=\"alert alert-error\">" + message + "</div>");
},
failedUploadTextDisplay: {
mode: "custom",
maxChars: 40,
responseProperty: "error",
enableTooltip: true
}
}).on("complete", function(event, id, fileName, responseJSON) {
if (responseJSON.success) {
$(this).append("<img src=\"/js/fine-uploader/processing.gif\" alt=\"" + fileName + "\">");
}
});
$("#breadcrumbs").xBreadcrumbs({});
});
/*]]>*/
</script>
</body>
答案 2 :(得分:1)
我在基本模式下使用fileUploader,所以:
HTML code:
<input type="file" id="btInput" name="btInput"><br/>
<button type="button" id="btStartUpload">Start</button>
Javascript:
$("#btStartUpload").on("click", function(evt) { var filesSelected = document.getElementById('btInput').files; // FileList object // var filesSelected = $('#btInput').prop('files'); // with jQuery // var filesSelected = $('#btInput')[0].files; // with jQuery, any jQuery object have it's DOM element accessed using [0] // var filesSelected = $('input[type=file]')[0].files; console.log(filesSelected); uploader.addFiles(filesSelected); });