<script>
$(document).ready(function() {
// Cloudinary jQuery integration library uses jQuery File Upload widget
// (see http://blueimp.github.io/jQuery-File-Upload/).
// Any file input field with cloudinary-fileupload class is automatically
// wrapped using the File Upload widget and configured for Cloudinary uploads.
// You can further customize the configuration using .fileupload method
// as we do below.
$(".cloudinary-fileupload")
.fileupload({
// Uncomment the following lines to enable client side image resizing and valiation.
// Make sure cloudinary/processing is included the js file
disableImageMetaDataLoad: true,
disableImageResize: false,
imageMaxWidth: 800,
imageMaxHeight: 800,
acceptFileTypes: /(\.|\/)(gif|jpe?g|png|bmp|ico)$/i,
maxFileSize: 20000000, // 20MB
dropZone: "#direct_upload",
start: function (e) {
$(".status").text("Starting upload...");
},
progress: function (e, data) {
$(".status").text("Uploading... " + Math.round((data.loaded * 100.0) / data.total) + "%");
},
fail: function (e, data) {
$(".status").text("Upload failed");
}
})
.off("cloudinarydone").on("cloudinarydone", function (e, data) {
$(".status").text("");
$(".preview").html(
$.cloudinary.image(data.result.public_id, {
format: data.result.format, width: 150, height: 100, crop: "limit"
})
);
});
});
</script>
2 回答
默认实现确实会在选择后自动上传文件 . 大多数用户不需要额外的存储空间 . 但是,如果您不希望在选择时自动上传图像,可以在
fileupload
调用中将autoUpload
设置为false
. 例如:我想你可以帮助我,实际上,我有这个脚本......
我开始使用javascript . 上面的这个脚本工作正常,但它只是在上传后显示预览 . 我不喜欢这种方法,因为如果用户更改预览图像,我将有一个文件上传到Cloudinary而不在我的数据库中进行相对注册 . 如果可以显示预览并且只是在用户按下表单中的提交后上传,那将会很棒 .
注意:我希望你理解我,我来自巴西,我不会用英语写得很好 .