Dropzone getAcceptedFiles() 产生 [object File] 而不是 file

Question

我添加了以下函数以尝试将一组文件名放入放置区：

function toggleUploadButton() {
    console.log(myDropzone.getAcceptedFiles() + "Accepted Files"); // []
    console.log(myDropzone.getQueuedFiles() + "Queued Files");  // []
    console.log(myDropzone.getRejectedFiles() + "Rejected Files");  // [File] <- same as above
}

但是，console.log 中的输出会产生：

[object File],[object File],

而不是文件名本身。

基本上我要做的是获取文件信息，以便我可以通过我的代码的不同部分通过 ajax 将其发送到上传。

[object File] 是否会保留上传的所有基本文件信息，还是需要采用不同的结构？

var myDropzone = new Dropzone("#myDropzone", {
    //$('#myDropzone').dropzone ({
    //Dropzone.options.myDropzone= {
        url: 'php/quoteSendTest.php',
        autoProcessQueue: false,
        paramName: "file",
        uploadMultiple: true,
        parallelUploads: 5,
        maxFiles: 5,
        maxFilesize: 25,
        acceptedFiles: 'image/*',
        addRemoveLinks: true,
        dictFileTooBig: 'File is larger than 25MB',
        init: function() {
            dzClosure = this; // Makes sure that 'this' is understood inside the functions below.

            // for Dropzone to process the queue (instead of default form behavior):
            document.getElementById("submit-all").addEventListener("click", function(e) {
                // Make sure that the form isn't actually being sent.
                console.log("Something should be showing for eventListener");
                //e.preventDefault();
                e.stopPropagation();
                dzClosure.processQueue();
            });

            this.on("addedfile", function(file) {
                /* Maybe display some more file information on your page */
                dragFileName = file.name;
                var dragFileSize = file.size;
                var count = myDropzone.files.length;
                console.log('File added - ' + file.name + ' - Size - ' + file.size);
                //console.log(dragFileName[]);
                console.log(count + " is the length");
                //toggleUploadButton();
                setTimeout(function () {
                    toggleUploadButton();
                }, 10);
            });

            //send all the form data along with the files:
            this.on("sendingmultiple", function(data, xhr, formData) {
                formData.append("firstname", jQuery("#firstname").val());
                formData.append("lastname", jQuery("#lastname").val());
            });
        }
    });
    function toggleUploadButton() {
        console.log(myDropzone.getAcceptedFiles() + "Accepted Files"); // []
        console.log(myDropzone.getQueuedFiles() + "Queued Files");  // []
        console.log(myDropzone.getRejectedFiles() + "Rejected Files");  // [File] <- same as above
    }

Answer 1

试试这个：

$.map(myDropzone.getAcceptedFiles(), function(file){ return file.name }).join(', ');

或者，将return 格式化为您要显示给用户的 HTML：

$.map(myDropzone.getAcceptedFiles(), function(file){ return '<span>'+file.name+'</span>' }).join('');