早上好社区 我对dropzone.js组件有疑问 我需要一个部分,可以在一格内看到缩略图,请使用组件 dropzone
有人可以帮助我如何创建那部分图像,
这是预览,但没有创建其他容器,我需要显示 它在dropzone中而不加载,并在另一个缩略图中显示缩略图 部分
购买摘要和图像结尾将被保存
有人对此有想法吗? 问候和感谢
示例: HTML:
<div id="my-dropzone" class="dropzone">
<div class="fallback">
<input type="file" id="file" name="file" multiple />
</div>
</div>
<div id="lista_imagenes">
</div>
JS:
Dropzone.autoDiscover = false;
var myDropzone = jQuery("#my-dropzone");
myDropzone.dropzone({
url: "uploadImagen.action",
method: "post",
paramName: "file", // El nombre que se usará para transferir el archivo
acceptedFiles: "image/*",
autoProcessQueue: false, //opcion por si se quiere enviar inmediatamente el archivo, {false} : no lo envia inmediatamente
maxFiles: 6,
maxFilesize: 2, // MB
parallelUploads: 6,
uploadMultiple: true,
addRemoveLinks: true,
init: function () {
this.on('removedfile', function (file){
alert("se elimino");
});
this.on('addedfile', function (evt) {
// var count = this.files.length;
var count = this.files;
// Obtenemos la imagen del campo "file".
for (var i = 0, f; f = count[i]; i++) {
alert(f);
//Solo admitimos imágenes.
if (!f.type.match('image.*')) {
continue;
}
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
// Insertamos la imagen
var respaldo=document.getElementById("lista_imagenes").innerHTML;
document.getElementById("lista_imagenes").innerHTML =respaldo+['<img class="thumb" src="', e.target.result,'" title="', escape(theFile.name), '"/>'].join('');
};
})(f);
reader.readAsDataURL(f);
}
});
}
});
使用此代码,但不起作用:(