1. 首页
  2. 其他语言
  3. web前端
  4. 正文

Uploadify参数详解

2014/05/28 4207点热度 0人点赞 0条评论 
 $('#file_upload').uploadify({ 
  //一属性详解
      id: jQuery(this).attr('id'),//绑定的input的ID
      langFile:'/assets/uploadify/uploadifyLang_en.js',//语言包的路径，能设置所有的提示文字
      swf: '/assets/uploadify/uploadify.swf',//[必须设置]swf的路径
      uploader: '/jsp/upload/upload.action',//[必须设置]处理上传动作的的url
      auto:false,//文件选择完成后，是否自动上传
      buttonText:'上传附件',//上传按钮的文字
      height: 30,//上传按钮的高和宽
      width: 120,
      formData:{},//JSON格式上传每个文件的同时提交到服务器的额外数据，可在’onUploadStart’事件中使用’settings’方法动态设置。
      buttonCursor: 'pointer',//上传鼠标hover后Cursor的形状
      cancelImage: 'http://www.static-xxx.nu/uploadify-cancel.png',//[必须设置]取消图片的路径
      checkExisting:'/uploader/uploadify-check-existing.action',//检查上传文件是否存，触发的url，返回1/0
      debug: true,//如果设置为true则表示启用SWFUpload的调试模式
      fileObjName:'file',//文件上传对象的名称
      fileSizeLimit : 0,//文件的极限大小，以字节为单位，0为不限制。1MB:1*1024*1024
      fileTypeDesc: 'Bild JPG',//允许上传的文件类型的描述，在弹出的文件选择框里会显示
      fileTypeExts: '*.jpg',//允许上传的文件类型，限制弹出文件选择框里能选择的文件
      method: 'post',//和后台交互的方式：post/get
      multi: true,//是否能选择多个文件
      itemTemplate:false,//用于设置上传队列的HTML模版，可以使用以下标签：instanceID – Uploadify实例的IDfileID – 列队中此文件的ID,或者理解为此任务的IDfileName – 文件的名称fileSize – 当前上传文件的大小插入模版标签时使用格式如：${fileName}
      queueID: 'fileQueue',//设置上传队列容器DOM元素的ID，如果为false则自动生成一个队列容器。
      queueSizeLimit : 999,//队列最多显示的任务数量，如果选择的文件数量超出此限制，将会出发onSelectError事件。 注意此项并非最大文件上传数量，如果要限制最大上传文件数量，应设置uploadLimit。
      progressData : 'all', // 'percentage''speed''all'//队列中显示文件上传进度的方式：all-上传速度+百分比，percentage-百分比，speed-上传速度
      removeCompleted : true,//是否自动将已完成任务从队列中删除，如果设置为false则会一直保留此任务显示。
      removeTimeout: 3,//如果设置了任务完成后自动从队列中移除，则可以规定从完成到被移除的时间间隔。
      requeueErrors : true,//如果设置为true，则单个任务上传失败后将返回错误，并重新加入任务队列上传。
      postData: {},//和后台交互时，附加的参数
      preventCaching : true,//如果为true，则每次上传文件时自动加上一串随机字符串参数，防止URL缓存影响上传结果
      transparent: true,
      overrideEvents:['onUploadProgress','',''],//设置哪些事件可以被重写，JSON格式，如：’overrideEvents’ : ['onUploadProgress']
      successTimeout : 30,//文件上传成功后服务端应返回成功标志，此项设置返回结果的超时时间
      timeoutuploadLimit:999,//能同时上传的文件数目
      uploadLimit:11,//最大上传文件数量，如果达到或超出此限制将会触发onUploadError事件。
 //二事件详解
    onCancel:function(file){//当点击文件队列中文件的关闭按钮或点击取消上传时触发，file参数为被取消上传的文件对象
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
    + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
    + ' - 文件名: ' + file.name
    + ' - 文件大小: ' + file.size
    + ' - 类型: ' + file.type
    + ' - 创建日期: ' + file.creationdate
    + ' - 修改日期: ' + file.modificationdate
    + ' - 文件状态: ' + file.filestatus);
    },
    onClearQueue:function(queueItemCount){//当调用函数cancel方法时触发，
      //queueItemCount参数为被取消上传的文件数量。
    alert('取消上传文件的数量：'+queueItemCount)；
    },
    onDestroy:function(){//当destory方法被调用时触发
    },
    onDisable:function(){//当disable方法禁用Uploadify上传按钮时被调用时触发。
    },
    onEnable:function(){//当disable方法启用Uploadify上传按钮时被调用时触发。
    },
    onFallback:function(){//当Uploadify初始化过程中检测到当前浏览器不支持flash时触发。
    },
    onInit:function(){// 首次初始化Uploadify结束时触发。
  },
  onDialogClose : function(swfuploadifyQueue) {//当文件选择对话框关闭时触发
    if( swfuploadifyQueue.filesErrored > 0 ){
       alert( '添加至队列时有'
             +swfuploadifyQueue.filesErrored
         +'个文件发生错误n'
             +'错误信息:'
             +swfuploadifyQueue.errorMsg
             +'n选定的文件数:'
             +swfuploadifyQueue.filesSelected
             +'n成功添加至队列的文件数:'
             +swfuploadifyQueue.filesQueued
             +'n队列中的总文件数量:'
             +swfuploadifyQueue.queueLength);
    };
  },
  onDialogOpen : function() {//当选择文件对话框打开时触发
     alert( 'Open!');
  },
  onSWFReady:function(){//Flash文件载入成功后触发。
  }, 
  onSelect : function(file) {//当每个文件添加至队列后触发
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus);
  },
  onSelectError : function(file,errorCode,errorMsg) {//当文件选定发生错误时触发
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus
      + ' - 错误代码: ' + errorCode
      + ' - 错误信息: ' + errorMsg
    );
  },
  onQueueComplete : function(stats) {//当队列中的所有文件全部完成上传时触发
    alert( '成功上传的文件数: ' + stats.successful_uploads
      + ' - 上传出错的文件数: ' + stats.upload_errors
      + ' - 取消上传的文件数: ' + stats.upload_cancelled
      + ' - 出错的文件数' + stats.queue_errors
    );
  },
  onUploadComplete : function(file,swfuploadifyQueue) {//每个文件上传完毕后无论成功与否都会触发一次
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus
      + ' - 出错的文件数: ' + swfuploadifyQueue.filesErrored
      + ' - 错误信息: ' + swfuploadifyQueue.errorMsg
      + ' - 要添加至队列的数量: ' + swfuploadifyQueue.filesSelected
      + ' - 添加至对立的数量: ' + swfuploadifyQueue.filesQueued
      + ' - 队列长度: ' + swfuploadifyQueue.queueLength);
  },
  onUploadError : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {//上传文件出错是触发（每个出错文件触发一次）
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus
      + ' - 错误代码: ' + errorCode
      + ' - 错误描述: ' + errorMsg
      + ' - 简要错误描述: ' + errorString
      + ' - 出错的文件数: ' + swfuploadifyQueue.filesErrored
      + ' - 错误信息: ' + swfuploadifyQueue.errorMsg
      + ' - 要添加至队列的数量: ' + swfuploadifyQueue.filesSelected
      + ' - 添加至对立的数量: ' + swfuploadifyQueue.filesQueued
      + ' - 队列长度: ' + swfuploadifyQueue.queueLength);
  },
  onUploadProgress : function(file,fileBytesLoaded,fileTotalBytes,
                        queueBytesLoaded,swfuploadifyQueueUploadSize) {//上传进度发生变更时触发
    alert( 'id: ' + file.id//队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index// SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus
      + ' - 当前文件已上传的字节数: ' + fileBytesLoaded
      + ' - 文件总字节数: ' + fileTotalBytes
      + ' - 当前任务队列中全部文件已上传的总字节数: ' + queueBytesLoaded
      + ' - 当前任务队列中全部文件的总字节数: ' + swfuploadifyQueueUploadSize
    );
  },
  onUploadStart: function(file) {//上传开始时触发（每个文件触发一次）
    alert( 'id: ' + file.id //队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index // SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus 
    );
  },
  onUploadSuccess : function(file,data,response) {//当文件上传成功时触发，每个文件会触发一次
    //file 文件对象
    alert( 'id: ' + file.id //队列中的id（如 SWFUpload_0_1）,在进度条显示的时候，对应文件进度条的id，可以控制显隐
      + ' - 索引: ' + file.index  // SWFUpload_0_1 后面的1
      + ' - 文件名: ' + file.name
      + ' - 文件大小: ' + file.size
      + ' - 类型: ' + file.type
      + ' - 创建日期: ' + file.creationdate
      + ' - 修改日期: ' + file.modificationdate
      + ' - 文件状态: ' + file.filestatus
      + ' - 服务器端消息: ' + 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','*')">开始上传所有文

 

 

相关文章：

  1. 基于基于uploadify 附件上传方法的封装
  2. jquery ui widget原理与自定义jQueryUI widget 插件
  3. metro风格首页实现可拖拽
  4. 百度map应用
  5. js版HashMap
  6. 解决jquery ui dialog 在ie9 下不居中问题
  7. 根据文章中H标签自动生成文章目录
  8. Jquery操作radio,checkbox,select表单操
  9. js判断浏览器类型
  10. 你真的已经搞懂JavaScript了吗?（转）
标签：
最后更新：2021/06/25

yxkong

这个人很懒，什么都没留下

文章评论

COPYRIGHT © 2022 我要编程. ALL RIGHTS RESERVED.

Theme Kratos Made By Seaton Jiang

京ICP备15055556号