uploadify批量文件、图片上传

来源:互联网 发布:centos非图形界面安装 编辑:程序博客网 时间:2024/05/26 19:14

1、uploadify3.x的使用方式有别与2.x的版本,3.x版本已经把swfobject.js 给嵌入jquery.uploadify-3.x.min.js中。下载地址:http://www.uploadify.com/download/

2、引入资源文件

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script><script type="text/javascript" src="uploadify3.2/jquery.uploadify.js"></script><link rel="stylesheet" href="uploadify3.2/uploadify.css" type="text/css"></link><style type="text/css">body {font: 13px Arial, Helvetica, Sans-serif;}#fileQueue {width: 400px;height: 300px;overflow: auto;border: 1px solid #E5E5E5;margin-bottom: 10px;}</style>

3、头部写入

<script type="text/javascript">          $(function() {              $("#multiple_file_upload").uploadify({                  'height'        : 27,                   'width'         : 80,                    'buttonText'    : '浏 览',                  'swf'           : 'uploadify3.2/uploadify.swf',                  'uploader'      : 'upload.do',                  'auto'          : false,                  'queueID'        : 'fileQueue',                'fileTypeExts'  : '*.jpg;*.png;*.gif;*.bmp',                  'formData'      : {'userName':'','qq':''},                  'onUploadStart' : function(file) {                      //$("#file_upload").uploadify("settings", "formData", {'userName':name,'qq':qq});                      //$("#file_upload").uploadify("settings", "qq", );                  }              });          });  </script> 


4、body中写入

<body><input type="file" name="uploadify" id="multiple_file_upload" />         <hr>         <div id="fileQueue"></div>       <a href="javascript:$('#multiple_file_upload').uploadify('upload','*')">开始上传</a>             <a href="javascript:$('#multiple_file_upload').uploadify('cancel', '*')">取消所有上传</a>   </body>

5、后台代码可以参考这个

http://blog.csdn.net/dracotianlong/article/details/8770348


【uploadify3.1使用二】批量文件、图片上传

http://blog.csdn.net/dracotianlong/article/details/8770348

【uploadify2.1使用一】【Spring MVC uploadify2.1】批量文件、图片上传

http://blog.csdn.net/dracotianlong/article/details/8770314


中文文档:

http://www.phptogether.com/uploadifydoc/

英文文档

http://www.uploadify.com/documentation/