zoukankan      html  css  js  c++  java
  • Uploadify 基于jquery的异步上传控件

      

      

    Uploadify 作为基于jquery的异步上传控件,依赖于jquery

    一、属性

    属性名称

    默认值

    说明

    auto

    true

    设置为true当选择文件后就直接上传了,为false需要点击上传按钮才上传 。

    buttonClass

    按钮样式

    buttonCursor

    ‘hand’

    鼠标指针悬停在按钮上的样子

    buttonImage

    null

    浏览按钮的图片的路径 。

    buttonText

    ‘SELECT FILES’

    浏览按钮的文本。

    checkExisting

    false

    文件上传重复性检查程序,检查即将上传的文件在服务器端是否已存在,存在返回1,不存在返回0

    debug

    false

    如果设置为true则表示启用SWFUpload的调试模式

    fileObjName

    ‘Filedata’

    文件上传对象的名称,如果命名为’the_files’,PHP程序可以用$_FILES['the_files']来处理上传的文件对象。

    fileSizeLimit

    0

    上传文件的大小限制 ,如果为整数型则表示以KB为单位的大小,如果是字符串,则可以使用(B, KB, MB, or GB)为单位,比如’2MB’;

    如果设置为0则表示无限制

    二、事件

    事件名称

    说明

    onCancel(file)

    当点击文件队列中文件的关闭按钮或点击取消上传时触发,file参数为被取消上传的文件对象

    onClearQueue(queueItemCount)

    当调用函数cancel方法时触发,queueItemCount参数为被取消上传的文件数量。

    onDestroy()

    当destory方法被调用时触发

    onDialogClose(queueData)

    当文件浏览框关闭时触发,如果将此事件被重写,则当向队列添加文件上传出错时不会弹出错误消息提示。

    queueData对象包含如下属性:

    • filesSelected 文件选择对话框中共选择了多少个文件
    • filesQueued 已经向队列中添加了多少个文件
    • filesReplaced 已经向队列中替换了多少个文件
    • filesCancelled 取消了多少个文件 filesErrored 出错了多少个文件

    onDialogOpen()

    当文件选择对话框弹出时立即出发,但可能在文件选择对话框被关闭之前并不能全部执行。

    onDisable()

    当disable方法禁用Uploadify上传按钮时被调用时触发。

    onEnable()

    当disable方法启用Uploadify上传按钮时被调用时触发。

    onFallback()

    当Uploadify初始化过程中检测到当前浏览器不支持flash时触发。

    onInit()

    首次初始化Uploadify结束时触发。

    onQueueComplete(queueData)

    文件上传队列处理完毕后触发。

    queueData对象包含如下属性:

    • uploadsSuccessful – 上传成功的文件数量
    • uploadsErrored – 上传失败的文件数量

    onSelect(file)

    选择文件后向队列中添加每个上传任务时都会触发。

    onSelectError(file, errorCode, errorMsg)

    选择文件后向队列中添加每个上传任务时如果失败都会触发。

    file – 文件对象

    errorCode – 错误代码如下:

    • QUEUE_LIMIT_EXCEEDED – 任务数量超出队列限制;
    • FILE_EXCEEDS_SIZE_LIMIT – 文件大小超出限制;
    • ZERO_BYTE_FILE – 文件大小为0
    • INVALID_FILETYPE – 文件类型不符合要求

    errorMsg – 错误提示,可通过’this.queueData.errorMsg’定制

    onSWFReady()

    Flash文件载入成功后触发。

    onUploadComplete(file)

    每个文件上传完毕后无论成功与否都会触发。

    onUploadError(file, errorCode, errorMsg, errorString)

    文件上传出错时触发,参数由服务端程序返回。

    onUploadProgress(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal)

    处理上传队列的过程中会多次触发此事件,每当任务状态有更新时都会触发。

    • file – 文件对象
    • bytesUploaded – 已上传的字节数
    • bytesTotal – 文件总字节数
    • totalBytesUploaded – 当前任务队列中全部文件已上传的总字节数
    • totalBytesTotal – 当前任务队列中全部文件的总字节数

    onUploadStart(file)

    当文件即将开始上传时立即触发

    onUploadSuccess(file, data, response)

    当文件上传成功时触发

    • file – 文件对象
    • data – 服务端输出返回的信息
    • response – 有输出时为true,如果无响应为false,如果返回的是false,当超过successTimeout设置的时间后假定为true

    三、方法

    方法名称

    说明

    应用举例

    cancel(fileID, suppressEvent)

    取消队列中的任务,不管此任务是否已经开始上传

    • fileID – 要取消的文件ID,如果为空则取消队列中第一个任务,如果为’*'则取消所有任务
    • suppressEvent – 是否阻止触发onUploadCancel事件,当清空队列时非常实用。

    <a href="javascript:$(‘#file_upload’).uploadify(‘cancel’)">取消第一个</a>

    <a href="javascript:$(‘#file_upload’).uploadify(‘cancel’, ‘*’)">清空队列</a>

    <a href="javascript:$(‘#file_upload’).uploadify(‘upload’, ‘*’)">开始上传所有任务</a>

    destroy()

    销毁Uploadify实例并将文件上传按钮恢复到原始状态

    <a href="javascript:$(‘#file_upload’).uploadify(‘destroy’)">销毁Uploadify实例</a>

    disable(setDisabled)

    禁用或启用文件浏览按钮

    setDisabled – 设置为true表示禁用,false为启用

    <a href="javascript:$(‘#file_upload’).uploadify(‘disable’, true)">禁用按钮</a>

    <a href="javascript:$(‘#file_upload’).uploadify(‘disable’, false)">启用按钮</a>

    settings(name, value, resetObjects)

    获取或设置Uploadify实例参数

    • name – 属性名称,如果只提供属性名称则表示获取其值
    • value – 属性值
    • resetObjects – 设置为true时,更新postData对象将清空现有的值。否则,新的值将被添加到其末尾。

    $(‘#file_upload’).uploadify(‘settings’,'buttonText’,'BROWSE’);

    $(‘#file_upload’).uploadify(‘settings’,'buttonText’));

    stop()

    停止当前正在上传的任务

    <a href="javascript:$(‘#file_upload’).uploadify(‘upload’, ‘*’)">开始上传</a>

    <a href="javascript:$(‘#file_upload’).uploadify(‘stop’)">停止上传</a>

    upload(fileID)

    立即上传指定的文件,如果fileID为’*'表示上传所有文件,要指定上传多个文件,则将每个文件的fileID作为一个参数

    <a href="javascript:$(‘#file_upload’).uploadify(‘upload’,'*’)">开始上传所

  • 相关阅读:
    eworkflow,eform,ebiao和信息系统的集成过程(for dotnet)
    HTTP协议详解
    phpstudy安装好之后mysql无法启动(亲测可行)
    关于在phpStudy环境下,windows cmd中 php不是内部命令问题
    php 中使用cURL发送get/post请求,上传图片,批处理
    Laravel 5.4: 特殊字段太长报错 420000 字段太长
    请自行检查是否安装VC9运行库??
    一起谈.NET技术,舍WebService 用.NET4中jQuery调用WCF 狼人:
    一起谈.NET技术,Silverlight 游戏开发小技巧:昼夜交替动画 狼人:
    一起谈.NET技术,Silverlight 2.5D RPG游戏技巧与特效处理:(一)序言 狼人:
  • 原文地址:https://www.cnblogs.com/Niuxingyu/p/10806001.html
Copyright © 2011-2022 走看看