php Dropzone 图像上传选项不起作用:(
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18032132/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dropzone image upload options not working :(
提问by relvira
Im trying to build a drag and drop image upload but dropzone options dont work and I dont know if im doing it the right way.
我正在尝试构建拖放图像上传，但 dropzone 选项不起作用，我不知道我是否以正确的方式执行此操作。
I would love to set up the following options:
我想设置以下选项：
Upload only one file (multiupload parameter)
Possibility to remove that file (addremovelink?)
Max file size of 2mb (maxfilesize)
只上传一个文件（multiupload 参数）
删除该文件的可能性（addremovelink？）
最大文件大小为 2mb (maxfilesize)
Can you help me please?
你能帮我吗？
here is the code:
这是代码：
<html>
<head>
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="dropzone.js" type="text/javascript"></script>
<link href="css/basic.css" rel="stylesheet" type="text/css" />
<link href="css/dropzone.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$("#uploadme").dropzone({
paramName: 'photos',
url: 'upload.php',
dictDefaultMessage: "Drag your images",
clickable: true,
enqueueForUpload: true,
maxFilesize: 1,
uploadMultiple: false,
addRemoveLinks: true
});
});
</script>
<form action="upload.php" class="dropzone">
<div id="uploadme" class="fallback">
<input name="file" type="file" multiple />
</div>
</form>
</body>
</html>
Thank you guys, you rock! :)
谢谢你们，你们摇滚！:)
回答by Alessandro Rivolta
Just add before Jquery call
只需在 Jquery 调用之前添加
Dropzone.autoDiscover = false;
and remove the action from the <form>.
That will disable the auto discover function so you can specify all the options for your form.
并从<form>. 这将禁用自动发现功能，因此您可以为表单指定所有选项。
This is what your code should look like:
你的代码应该是这样的：
<html>
<head>
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="dropzone.js" type="text/javascript"></script>
<link href="css/basic.css" rel="stylesheet" type="text/css" />
<link href="css/dropzone.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
Dropzone.autoDiscover = false;
$("#uploadme").dropzone({
paramName: 'photos',
url: 'upload.php',
dictDefaultMessage: "Drag your images",
clickable: true,
enqueueForUpload: true,
maxFilesize: 1,
uploadMultiple: false,
addRemoveLinks: true
});
});
</script>
<form action="" class="dropzone">
<div id="uploadme" class="fallback">
<input name="file" type="file" multiple />
</div>
</form>
</body>
</html>
回答by Jeremiah S
In my situation I had to use the vanilla JS Dropzone Class instantiation and put the Dropzone.autoDiscover = false;outside of the $(document).readyfunction.
在我的情况下，我不得不使用 vanilla JS Dropzone 类实例化并将函数放在Dropzone.autoDiscover = false;外面$(document).ready。
html:
html：
<form id="image-upload" action="/upload" class="dropzone" method="post" name="file"></form>
javascript:
javascript:
<script>
Dropzone.autoDiscover = false;
$(document).ready(function() {
var myDropzone = new Dropzone('form#image-upload',{
maxFiles:12,
acceptedFiles: 'image/*',
dictInvalidFileType: 'This form only accepts images.'
});
});
回答by DanJGer
maxFilesize: 2,
uploadMultiple: false,
addRemoveLinks: true,
maxFiles: 1,
autoProcessQueue: false
You will need to add in a button or event handler to allow for processing of the previewed file, if you let it autoProcessQueue you don't have time to decide if you want the file or not unless you add an event handler at the "process" event.
您将需要添加一个按钮或事件处理程序以允许处理预览文件，如果您让它自动处理队列，您将没有时间决定是否需要该文件，除非您在“进程”中添加事件处理程序“ 事件。
$("#uploadme").dropzone.processQueue()
