Javascript Plupload - 仅限一个文件

Plupload - Restrict to only one file

提问by JohnO

I don't see an option in the plupload API docs on restricting the number of files uploaded, to any number, even 1.

我在 plupload API 文档中没有看到将上传的文件数量限制为任意数量，甚至是 1 的选项。

Doc fail? or Feature fail? If it doesn't exist I'll be working on making that happen if anyone needs it..

博士失败？或功能失败？如果它不存在，如果有人需要它，我将努力实现它。

采纳答案by Jonathon Bolster

It's a feature fail. I made a wrapper around the jQuery API and this is what I did to make it work for me. My code does some other business logic, but it should give you enough to set started.

这是一个功能失败。我在 jQuery API 周围做了一个包装器，这就是我所做的让它对我有用。我的代码做了一些其他的业务逻辑，但它应该足以让你开始。

Basically, bind to the FilesAddedevent and call removeFileon the uploader object (if there are too many files). I think I added the 50ms timeout because it was giving me problems with the file not existing yet.

基本上，绑定到FilesAdded事件并调用removeFile上传器对象（如果文件太多）。我想我添加了 50ms 超时，因为它给我的文件不存在的问题。

uploader.bind('FilesAdded', function (up, files) {
    var i = up.files.length,
        maxCountError = false;

    plupload.each(files, function (file) {

        if(uploader.settings.max_file_count && i >= uploader.settings.max_file_count){
            maxCountError = true;
            setTimeout(function(){ up.removeFile(file); }, 50);
        }else{
            // Code to add pending file details, if you want
        }

        i++;
    });

    if(maxCountError){
        // Too many files uploaded, do something
    }

});

max_file_countis something that I add to the pluploader instance when I create it.

max_file_count是我在创建它时添加到 pluploader 实例的东西。

---

---

Edit: I actually had to do two different ways for this. The above will only allow a person to upload a certain number of files (and generate an error otherwise).

编辑：我实际上不得不为此做两种不同的方法。以上只允许一个人上传一定数量的文件（否则会产生错误）。

This snippet works in a similar way - but will remove existing files and only upload the most recent:

此代码段以类似的方式工作 - 但会删除现有文件并仅上传最新文件：

uploader.bind('FilesAdded', function (up, files) {
    var fileCount = up.files.length,
        i = 0,
        ids = $.map(up.files, function (item) { return item.id; });

    for (i = 0; i < fileCount; i++) {
        uploader.removeFile(uploader.getFile(ids[i]));
    }

    // Do something with file details
});

回答by octavioccl

Other way to do this:

其他方法来做到这一点：

 $(document).ready(function () {
    var uploader = new plupload.Uploader({
        ...
        multi_selection: false,
       ....
     });

Regards

问候

回答by JoaoPSF

Based on Jonathon Bolster's second answer, I wrote this simpler snippet to restrict upload to the last selected file:

基于 Jonathon Bolster 的第二个答案，我写了这个更简单的片段来限制上传到最后一个选定的文件：

uploader.bind('FilesAdded', function(up, files) {
    while (up.files.length > 1) {
        up.removeFile(up.files[0]);
    }
});

回答by coder

You can use this max_file_count: 5where 5 is the max number of upload count.

您可以使用它 max_file_count: 5，其中 5 是最大上传计数。

回答by 8bitjoey

Why not just

为什么不只是

    if (files.length > 1) uploader.splice(1, files.length - 1);

回答by Vladimir Djuricic

Try this. It works fine for me.

尝试这个。这对我来说可以。

uploader.bind('FilesAdded', function(up, files) {

if(uploader.files.length > 1)
{
    uploader.removeFile(uploader.files[0]);
    uploader.refresh();// must refresh for flash runtime
}

. . . resto

. . . 恢复

Idea is to test num files in current uploader object. If length is greater than 1, then just use method uploader.removeFile. Notice that argument is files[0]which is not a file id, but complete file object.

想法是测试当前上传对象中的 num 个文件。如果长度大于 1，则只需使用 method uploader.removeFile。请注意，参数 is files[0]which 不是文件 ID，而是完整的文件对象。

({id:"p17bqh1v4dp42gdf1gan75p16tp3", name:"gnome-globe.png", size:48456, loaded:0, percent:0, status:1})

Best regards!

此致！

回答by chuck911

now you can disable multi-selection by setting multi_selectionoption to false

现在您可以通过将multi_selection选项设置为false来禁用多选

just like this

像这样

var uploader = new plupload.Uploader({
    runtimes : 'html5,flash',
    browse_button : 'button_id',
    multi_selection:false,  //disable multi-selection
...

official doc is here : http://www.plupload.com/documentation.php

官方文档在这里：http: //www.plupload.com/documentation.php

回答by Sheikh Abdul Wahid

    FilesAdded: function(up, files) {
        up.files.splice(0,up.files.length-1);
    },
    multi_selection: false,

use up.files, just files. fileswill always contain single item what we select from file browser. up.filesis the actual list which we need to shrink to last selected file.

使用up.files，只是files。files将始终包含我们从文件浏览器中选择的单个项目。up.files是我们需要缩小到最后选择的文件的实际列表。

回答by James

I realize this has been answered, but a solution I went with was to just use the QueueChangedcallback:

我意识到这已经得到了回答，但我采用的解决方案是只使用QueueChanged回调：

QueueChanged: function(uploader) {
    // Called when queue is changed by adding or removing files
    //log('[QueueChanged]');
    if(uploader.files.length > 1) {
        uploader.files.splice(0, (parseInt(uploader.files.length) - 1));
    }
}

With this code, it only keeps the last selected file (in case the reason they chose again was because they chose the wrong file).

使用此代码，它只保留最后选择的文件（以防他们再次选择的原因是因为他们选择了错误的文件）。

回答by Simon Ilett

If you want to use a custom uploader, and upload one file at a time, no auto upload and have the last file added become the new file use this.

如果您想使用自定义上传器，并且一次上传一个文件，则不会自动上传并且将添加的最后一个文件成为新文件，请使用此方法。

uploader.bind('FilesAdded', function(up, files) {
    // Clear the HTML
    $('#plupload-files').html('');

    // Plup does not offer before file added event
    if (up.files.length > 1) {
        up.splice(0, up.files.length);
        up.addFile(files[0])
        return;
    }

    // $.each(files, function(){....
}

We splice the whole array because plup already adds all the files to the queue and if you splice the queue like the accepted answer you will actually add one file everytime the user tries to add files, and if they try to add a new file singularly it will keep the old file at pos[0] in the files array,

我们拼接整个数组，因为 plup 已经将所有文件添加到队列中，如果你像接受的答案一样拼接队列，你实际上会在每次用户尝试添加文件时添加一个文件，如果他们尝试单独添加一个新文件将旧文件保留在文件数组中的 pos[0] 处，

Then we add the first file of the files that they tried to add. This way there is only ever one file in the queue and it is always the first file in the last group of files they tried to add.

然后我们添加他们尝试添加的文件的第一个文件。这样，队列中只有一个文件，并且它始终是他们尝试添加的最后一组文件中的第一个文件。

ie.

IE。

Drag into plupload 'file1.jpg', 'file2.jpg', 'file3.jpg'

拖入 plupload 'file1.jpg', 'file2.jpg', 'file3.jpg'

clear the whole queue, add back 'file1.jpg'

清除整个队列，添加回'file1.jpg'

Drag into plupload 'file4.jpg', 'file5.jpg', 'file6.jpg'

拖入 plupload 'file4.jpg', 'file5.jpg', 'file6.jpg'

clear the whole queue, add back 'file4.jpg'

清除整个队列，添加回'file4.jpg'

Drag into plupload 'file99.jpg'

拖入 plupload 'file99.jpg'

clear the whole queue, add back 'file99.jpg'

清除整个队列，添加回'file99.jpg'

This allows you to manage custom plups if you only ever want to upload one file at a time. As stated the other answers only work once, or with auto start uploads.

如果您一次只想上传一个文件，这允许您管理自定义 plups。如前所述，其他答案只能工作一次，或者自动开始上传。