如何更改dropzone.js中的默认文本？
我正在使用dropzone.js上传文件。 不过，我很难更改默认文本。
我试过实例化的dropzone类：
$(document).ready(function(){ $(".foo").dropzone({ dictDefaultMessage: "hello" }); }); 有了这个标记：
<div class="span4"> <form action="http://localhost/post" method="post" accept-charset="utf-8" id="drop3" class="foo" enctype="multipart/form-data"> </form> </div> <div class="span4"> <form action="http://localhost/post" method="post" accept-charset="utf-8" id="drop4" class="foo" enctype="multipart/form-data"> </form> </div>
这当然给了我上传文件的能力，但默认文本是空白的。
我testing了以下内容：
$(".foo").dropzone();
我似乎得到相同的结果 – 没有默认的文字。 所以..我如何改变默认的文字？
在你的dropzone表单中添加一个元素，如下所示：
<div class="dz-message" data-dz-message><span>Your Custom Message</span></div>
创builddropzone时，可以像这样设置默认消息。
var dropzone = new Dropzone("form.dropzone", { dictDefaultMessage: "Put your custom message here" });
然后
$('div.dz-default.dz-message > span').show(); // Show message span $('div.dz-default.dz-message').css({'opacity':1, 'background-image': 'none'});
你可以用这个来更改所有的默认信息 ：
Dropzone.prototype.defaultOptions.dictDefaultMessage = "Drop files here to upload"; Dropzone.prototype.defaultOptions.dictFallbackMessage = "Your browser does not support drag'n'drop file uploads."; Dropzone.prototype.defaultOptions.dictFallbackText = "Please use the fallback form below to upload your files like in the olden days."; Dropzone.prototype.defaultOptions.dictFileTooBig = "File is too big ({{filesize}}MiB). Max filesize: {{maxFilesize}}MiB."; Dropzone.prototype.defaultOptions.dictInvalidFileType = "You can't upload files of this type."; Dropzone.prototype.defaultOptions.dictResponseError = "Server responded with {{statusCode}} code."; Dropzone.prototype.defaultOptions.dictCancelUpload = "Cancel upload"; Dropzone.prototype.defaultOptions.dictCancelUploadConfirmation = "Are you sure you want to cancel this upload?"; Dropzone.prototype.defaultOptions.dictRemoveFile = "Remove file"; Dropzone.prototype.defaultOptions.dictMaxFilesExceeded = "You can not upload any more files.";
首先添加一个id到你的表单，比如mydz ，然后添加这个js：
Dropzone.options.mydz = { dictDefaultMessage: "your custom message" };
整个页面（在这种情况下index.php）：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <script src="dropzone.js"></script> <link rel="stylesheet" type="text/css" href="./dropzone.css"> <title></title> </head> <body> <form action="upload.php" class="dropzone" id="mydz"></form> <script type="text/javascript"> Dropzone.options.mydz = { dictDefaultMessage: "Put your custom message here" }; </script> </body> </html>
这个文本是在dropzone的默认configuration中，你可以像这样覆盖：
Dropzone.prototype.defaultOptions.dictDefaultMessage = "Your text";
如果你不反对JQuery，这将隐藏默认图像：
$('form.dropzone').find('div.default.message').css('background-image','none');
并且，这将显示默认跨度，您可以更改为任何你想要的：
$('form.dropzone').find('div.default.message').find('span').show(); $('form.dropzone').find('div.default.message').find('span').empty(); $('form.dropzone').find('div.default.message').find('span').append('Drop files here or click here to upload an image.');
在dropzone的css中寻找
.dropzone .dz-default.dz-message
在这个类中删除
background-image: url("..http://img.dovov.comspritemap.png");
接下来要做的是search这个类
.dropzone .dz-default.dz-message span { display: none; }
并将其更改为显示：块
myDropzonePhotos = new Dropzone('#dropzone-test', { url : 'upload_usuario.php?id_usuario=' + id_usuario, maxFiles : 1, thumbnailWidth : 1200, thumbnailHeight : 300, dictDefaultMessage : 'Change the text here!', init: function() { ....
