【发布时间】:2011-12-18 22:19:00
【问题描述】:
我在 plupload API 文档中没有看到关于将上传的文件数量限制为任意数量,甚至 1 个的选项。
文档失败?或功能失败?如果它不存在,如果有人需要,我会努力实现它..
【问题讨论】:
标签: javascript plupload
我在 plupload API 文档中没有看到关于将上传的文件数量限制为任意数量,甚至 1 个的选项。
文档失败?或功能失败?如果它不存在,如果有人需要,我会努力实现它..
【问题讨论】:
标签: javascript plupload
这是一个功能失败。我围绕 jQuery API 做了一个包装器,这就是我所做的让它为我工作的方法。我的代码执行了一些其他业务逻辑,但它应该足以让您开始设置。
基本上,绑定到FilesAdded 事件并在上传器对象上调用removeFile(如果文件太多)。我想我添加了 50 毫秒超时,因为它给我带来了文件尚不存在的问题。
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_count 是我在创建 pluploader 实例时添加的内容。
编辑:我实际上必须为此做两种不同的方法。以上将只允许一个人上传一定数量的文件(否则会产生错误)。
此 sn-p 以类似的方式工作 - 但会删除现有文件并仅上传最新的:
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
});
【讨论】:
max_file_count 已添加到 jQuery UI 小部件中。这仍然不适用于我的应用程序,因为我想要一个人们可以上传 X 个文件的存储桶(因此它需要考虑存储桶中现有的上传文件)
i < (fileCount - 1) 运行循环仅保留最近添加的文件。
其他方法:
$(document).ready(function () {
var uploader = new plupload.Uploader({
...
multi_selection: false,
....
});
问候
【讨论】:
基于 Jonathon Bolster 的第二个答案,我编写了这个更简单的 sn-p 来限制上传到最后选择的文件:
uploader.bind('FilesAdded', function(up, files) {
while (up.files.length > 1) {
up.removeFile(up.files[0]);
}
});
【讨论】:
您可以使用此max_file_count: 5,其中 5 是最大上传数。
【讨论】:
max_file_count 不是 plupload 中的标准设置
max_file_count (github.com/moxiecode/plupload/blob/master/examples/jquery/…)。另外,请注意添加代码或任何东西都应该通过编辑你的答案来完成(除非它是一个完全不同的答案)
为什么不直接
if (files.length > 1) uploader.splice(1, files.length - 1);
【讨论】:
试试这个。对我来说效果很好。
uploader.bind('FilesAdded', function(up, files) {
if(uploader.files.length > 1)
{
uploader.removeFile(uploader.files[0]);
uploader.refresh();// must refresh for flash runtime
}
。 . .恢复
想法是测试当前上传器对象中的 num 个文件。如果长度大于 1,则只需使用方法uploader.removeFile。请注意,参数是 files[0],它不是文件 id,而是完整的文件对象。
({id:"p17bqh1v4dp42gdf1gan75p16tp3", name:"gnome-globe.png", size:48456, loaded:0, percent:0, status:1})
最好的问候!
【讨论】:
现在您可以通过将 multi_selection 选项设置为 false
来禁用多选就这样
var uploader = new plupload.Uploader({
runtimes : 'html5,flash',
browse_button : 'button_id',
multi_selection:false, //disable multi-selection
...
【讨论】:
FilesAdded: function(up, files) {
up.files.splice(0,up.files.length-1);
},
multi_selection: false,
使用up.files,只需files。 files 将始终包含我们从文件浏览器中选择的单个项目。 up.files 是我们需要缩小到最后选择的文件的实际列表。
【讨论】:
只允许上传一个文件:
uploader.bind('FilesAdded', function(up, files) {
$.each(files, function(i, file) {
if(uploader.files.length!=1){uploader.removeFile(file); return;}
});
});
允许一次选择一个文件:
uploader.bind('FilesAdded', function(up, files) {
$.each(files, function(i, file) {
if(i){up.removeFile(file); return;}
});
});
允许一次上传一个文件:
uploader.bind('FilesAdded', function(up, files) {
$.each(files, function(i, file) {
if(uploader.files.length!=1){uploader.removeFile(file); return;}
});
});
uploader.bind('FileUploaded', function(up, file,response) {
up.removeFile(file);
});
【讨论】:
我意识到这个问题已经得到解答,但我采用的解决方案是只使用 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));
}
}
使用此代码,它只保留最后选择的文件(以防他们再次选择的原因是因为他们选择了错误的文件)。
【讨论】:
如果您想使用自定义上传器,并且一次上传一个文件,则不自动上传,并让最后添加的文件成为新文件。
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(){....
}
我们拼接整个数组,因为 plup 已经将所有文件添加到队列中,如果您像接受的答案一样拼接队列,您实际上将在每次用户尝试添加文件时添加一个文件,如果他们尝试添加一个新文件文件单独它会将旧文件保留在文件数组中的 pos[0] 处,
然后我们添加他们尝试添加的文件的第一个文件。这样,队列中只有一个文件,并且始终是他们尝试添加的最后一组文件中的第一个文件。
即。
拖入plupload 'file1.jpg', 'file2.jpg', 'file3.jpg'
清空整个队列,加回'file1.jpg'
拖入plupload 'file4.jpg', 'file5.jpg', 'file6.jpg'
清空整个队列,添加回'file4.jpg'
拖入plupload 'file99.jpg'
清空整个队列,添加回'file99.jpg'
如果您一次只想上传一个文件,这允许您管理自定义插件。如前所述,其他答案只能使用一次,或者自动开始上传。
【讨论】:
在上传之前直接删除不需要的文件:
$('uploadfiles').onclick = function()
{
while (uploader.files.length > 1)
{
uploader.removeFile(uploader.files[0]);
}
uploader.start();
return false;
};
【讨论】:
在尝试了每种解决方案后,我想出了最简单的方法——这似乎可行。
我正在使用核心 api,并且我将 multi_selection 设置为 false。然后,在选择(添加)第一个文件后,我插入到 FilesAdded 事件中的第二行代码隐藏了浏览链接。我认为这不能用 jquery 小部件来完成,而且我还发现,除非上传链接覆盖浏览链接所在的位置,否则它仍然存在。
uploader.bind('FilesAdded', function(up, files) {
//line below hides button
document.getElementById("browse").style.display = "none";
var html = '';
plupload.each(files, function(file) {
html += '<li id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></li>';
});
document.getElementById('filelist').innerHTML += html;
});
【讨论】: