方法
这个插件支持如下方法。查看插件各种方法的演示,请点击这里。
下面的许多方法支持链式调用其他方法,因为它们将文件输入元素作为jQuery对象返回。
disable
禁用文件输入控件。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('disable');
// 链式调用启用输入控件
$('#input-id').fileinput('disable').fileinput('enable');
enable
启用文件输入控件。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('enable');
// 链式调用禁用输入控件
$('#input-id').fileinput('enable').fileinput('disable');
reset
重置文件输入控件。此方法将文件输入元素作为jQuery对象返回,可以链式调用其他方法。
$('#input-id').fileinput('reset');
// 链式调用
$('#input-id').fileinput('reset').trigger('custom-event');
destroy
销毁文件输入控件并恢复到普通的本地文件输入。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('destroy');
// 链式方法
$('#input-id').fileinput('destroy').fileinput('disable');
refresh
根据提供的参数刷新文件输入控件。你可以提供一组控件选项作为参数。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
// 例1(在运行时禁用)
$('#input-id').attr('disabled', 'disabled');
$('#input-id').fileinput('refresh');
// 例2(在运行时修改插件参数)example 2 (modify plugin options at runtime)
$('#input-id').fileinput('refresh', {browseLabel: 'Select...', removeLabel: 'Delete'});
// 链式方法
$('#input-id').fileinput('refresh', {showCaption: false}).fileinput('disable');
clear
清理文件输入控件。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('clear');
// 方法链
$('#input-id').fileinput('clear').fileinput('disable');
upload
触发所选文件的ajax上传。仅适用于uploadUrl
已设置的情况。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('upload');
// 方法链
$('#input-id').fileinput('upload').fileinput('disable');
cancel
取消正在进行的ajax文件上传。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('cancel');
// 方法链
$('#input-id').fileinput('cancel').fileinput('disable');
lock
锁定文件输入控件,禁用除取消按钮(中止正在进行的AJAX请求)之外的所有操作/按钮。(仅适用于ajax上传)此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('lock');
// 方法链
$('#input-id').fileinput('lock').fileinput('disable');
unlock
通过反转lock
动作的结果解锁并重新启动文件输入控件。此方法将文件输入元素作为jQuery对象返回,因此可以链式调用其他方法。
$('#input-id').fileinput('unlock');
// 方法链
$('#input-id').fileinput('unlock').fileinput('disable');
addToStack
此方法将文件对象推入(追加)到用来上传的缓存文件堆栈数组。你必须传入一个文件对象作为参数。
$('#input-id').fileinput('addToStack', fileObj); // `fileObj`是文件blob对象实例
updateStack
此方法用指定的数组索引更新/重载一个缓存文件堆栈数组中的文件对象,以指定数组索引。你必须传入数组索引数和文件对象作为参数。
$('#input-id').fileinput('updateStack', index, fileObj);
// `index`是你要更新/重载的`fileObj`的缓存文件数组索引。
clearStack
此方法清除整个文件上传数组堆栈。
$('#input-id').fileinput('clearStack');
getFileStack
这个方法返回已选择选择文件对象数组(只有当uploadurl
被设置且进行ajax上传时适用。)这个方法不会返回验证失败或者已经上传的文件。
var files = $('#input-id').fileinput('getFileStack'); // 返回选中的文件队列
如上所述,请注意,此方法仅对于为ajax上传获取文件对象非常有用。对于正常的基于表单的提交,你可以通过直接读取输入值来获取选定的文件。例如$('#input-id').val()
。
getFilesCount
此方法返回所有待上传的文件和已上传的文件(基于初始预览)的计数。计数将包括从客户端(未上传)中选择的文件加上传到服务器并通过初始预览显示的文件。validateInitialCount将用于检查是否使用初始预览计数。当设置uploadUrl
时,此方法将返回正常表单提交以及ajax上传的文件数。
var filesCount = $('#input-id').fileinput('getFilesCount'); // 返回文件(已经上传和等待上传)计数
zoom
放大缩小传入帧ID参数的详细预览内容。
$('#input-id').fileinput('zoom', 'preview-123882'); // 传入缩略图框架的HTML id。
getPreview
返回初始预览内容,初始预览配置和初始预览缩略图标签。作为下列格式的对象(关联数组)返回结果:
{
content: ['content1', 'content2'],
config: [
{
// content1 的初始化预览配置
},
{
// content2 的初始化预览配置
},
],
tags: [
{
// content1 的初始化预览标签
},
{
// content2 的初始化预览标签
},
]
}
使用范例:
console.log($('#input-id').fileinput('getPreview'));