使用 addInitialFiles 方法时出错

Question

我在尝试使用此处列出的 addInitialFiles 方法时遇到问题：

http://docs.fineuploader.com/branch/master/api/methods.html#addInitialFiles

我的 chrome 开发控制台出现 javascript 错误：

1032:381 Uncaught TypeError: uploader.addInitialFiles is not a function

这是我用来初始化 Fine Uploader 的代码，并调用 addInitialFiles():

<script type="text/javascript">
$(function () {
    var uploader = $('#fine-uploader').fineUploaderS3({
        request: {
            endpoint: "myfineuploaderbucket.com.s3.amazonaws.com",
            accessKey: "XXXXXXXXXXXXXXXXXXXXXXXX",
        },
        signature: {
            endpoint: "/SignatureHandler",
            version: 4
        },
        validation: {
            allowedExtensions: ["gif", "jpeg", "jpg", "png", "bmp"],
            acceptFiles: "image/gif, image/jpeg, image/png, image/bmp",
            sizeLimit: 5000000,
            itemLimit: 3
        },
        retry: {
            enableAuto: true
        },
        deleteFile: {
            enabled: true,
            endpoint: "/DeleteImage/?id=@Model.Id",
            method: 'POST',
        },
        paste: {
            targetElement: $(document),
            promptForName: true
        },
        uploadSuccess: {
            endpoint: "/UploadSuccessful/?id=@Model.Id"
        },
        iframeSupport: { //This path needs to be a blank HTML page and is used for fine-uploader to support IE9 and older
            localBlankPagePath: "/Blank"
        },
        objectProperties: {
            acl: "public-read",
            key: function (fileId) {
                var re = /(?:\.([^.]+))?$/;
                fileExt = re.exec($("#fine-uploader").fineUploader("getName", fileId))[0];
                uuid = $("#fine-uploader").fineUploader("getUuid", fileId);
                filename = uuid + fileExt;
                key = "/@ViewBag.Id + "/" + filename;
                return key;
            }
        },
        scaling: {
            hideScaled: true,
            sizes: [
                { name: "small", maxSize: 350 },
                { name: "large", maxSize: 800 },
            ]
        },
        callbacks: {
            onDelete: function (id) {
                if (id == 2) {
                    $("#fine-uploader").fineUploader("deleteFile", 0);
                    $("#fine-uploader").fineUploader("deleteFile", 1);
                }
            },
        },
    });

    uploader.addInitialFiles([
            {
                "name": "a3ef2360-881d-452c-a5f6-a173d5291066.jpg",
                "uuid": "a3ef2360-881d-452c-a5f6-a173d5291066",
                "size": "66000",
                "thumbnailUrl": "https://s3.amazonaws.com/myfineuploaderbucket.com/1032/ecdca7bb-fb02-4072-b526-4e51cedb1f2b.jpg",
                "s3Key": "1032/a3ef2360-881d-452c-a5f6-a173d5291066.jpg",
                "s3Bucket": "myfineuploaderbucket.com"
            }
    ]);

我做错了什么吗？ addInitialFiles 不是方法，而是创建Fine Uploader 实例时需要初始化的选项吗？我也尝试将 "addInitialFiles" 添加到 Fine Uploader 实例的选项中，但我没有收到 javascript 错误，但它也不会加载初始文件。

我使用的是最新版本 5.7.1。

Answer 1

就像任何其他 jQuery 插件一样，Fine Uploader jQuery 包装器 returns 是一个 jQuery 包装的元素。这意味着您正试图在 jQuery 对象上调用 addInitialFiles 方法。当然，这种方法是不存在的。如果你真的想继续使用 jQuery 包装器，你必须将 uploader.addInitialFiles(...) 更改为 uploader.fineUploaderS3('addInitialFiles', ...)。

但您应该知道 you don't need jQuery for any of this, especially when using Fine Uploader. There is no benefit to using the jQuery wrapper with Fine Uploader，您可以通过放弃包装器（并节省几个字节）并将 Fine Uploader 初始化的前几行更改为：

var uploader = new qq.s3.FineUploader({
   element: document.querySelector('#fine-uploader'),
   ...
})

现在，uploader.addInitialFiles 如您所愿。

使用 addInitialFiles 方法时出错

Error using addInitialFiles Method

fine-uploader