dropzone.js从服务器检索时禁止进度条

tll*_*lyn 8 javascript css jquery dropzone.js

使用dropzone.js,我没有遇到任何问题,包括检索以前上传到服务器的图像.

我遇到的唯一问题是当我在页面刷新时从服务器检索这些文件时(意味着它们在此页面的当前使用期间未上载),将永久显示上载进度条.有没有办法抑制以前上传的图像的进度条?我想在上传时继续使用进度条,并且不想从模板中删除css.

并不是说它在这种情况下有用,但这里是我用来检索文件并在远程预览div中显示它们的代码.

Dropzone.options.myDropzone = {
    previewsContainer: document.getElementById("previews"),
    init: function() 
    {
    thisDropzone = this;

    $.get('../cgi/fileUpload.php', function(data) 
    {
        $.each(data, function(key,value)
        {
            var mockFile = { name: value.name, size: value.size};
            thisDropzone.options.addedfile.call(thisDropzone, mockFile);
            thisDropzone.options.thumbnail.call(thisDropzone, mockFile, value.uploaddir+value.name);

            var strippedName = (value.name).slice(11);
            fileList[i] = {"serverFileName" : value.name, "fileName" : value.name, "fileSize" : value.size, "fileId" : i };
            i++;


            var removeButton = Dropzone.createElement("<button class=\"btn btnremove\" style=\"width: 100%;\">Remove file</button>");

            var _this = this;

            removeButton.addEventListener("click", function(e) 
            {

                e.preventDefault();
                e.stopPropagation();

                thisDropzone.removeFile(mockFile);

            });

            mockFile.previewElement.appendChild(removeButton);

        });
    });
},
url: "../cgi/fileUpload.php"
};
Run Code Online (Sandbox Code Playgroud)

ecl*_*ude 16

确保没有进度条等...

thisDropzone.emit("complete", mockFile);
Run Code Online (Sandbox Code Playgroud)

常见问题 Dropzone.JS


小智 6

这是一个老问题,但我遇到了同样的问题.我的解决方案是编辑我的.css文件:

.dz-progress {
  /* progress bar covers file name */
  display: none !important;
}
Run Code Online (Sandbox Code Playgroud)


Gir*_*hod 6

我有同样的问题.

$(" DZ-进步.)隐藏().

如果你使用.hide()而不是.remove()方法会很棒.因为.remove()删除了div永久物.


tll*_*lyn 5

回答了!选择在交付后使用 jquery 删除 div:

$(".dz-progress").remove();
Run Code Online (Sandbox Code Playgroud)

不是过于优雅,但它的工作原理。

  • 是的,或者你可以使用`$('.dz-preview').addClass('dz-complete');` (4认同)