基于jQuery上传组件非常多,其中uploadify是其中比较优秀并且好用的,可以完美支持PHP以及其他编程语言。此外,uploadify结合flash进行上传,如果对fla文件进行修改和重新编译的话,可以获得完全不同的用户体验。
uploadify上传的HTML代码。
uploadify上传的jQuery代码。
01 | $(document).ready( function () { |
02 |
$( '#imgUpload' ).uploadify({ |
03 |
'uploader'
: '../uploadcom/uploadify.swf' , |
04 |
'script'
: '../uploadcom/uploadify.php' , |
05 |
'cancelImg'
: '../uploadcom/cancel.png' , |
06 |
'folder'
: '../uploads/images' , |
07 |
'fileExt'
: '*.jpg;*.jpeg;*.gif;*.png;*.bmp' ,
|
10 |
'displayData' :
'speed' , |
11 |
'removeCompleted' :
false , |
12 |
'onComplete'
: function
(event, queueID, fileObj, response, data) { |
其中response是上传成功后返回的文件路径,可以把这个值加入到表单中或者使用ajax传递到其他页面。如果是多文件上传,response是所有文件路径拼接起来的字符串。注:上传文件的路径以及字符串可以在相应的编程语言中修改!
uploadify的一些参数配置
'uploader' : 'uploader.swf', //指定上传控件的主体文件,默认‘uploader.swf’
'script' : 'upload.php', //指定服务器端上传处理文件,默认‘upload.php’
'cancelImg' : 'cancel.png', //指定取消上传的图片,默认‘cancel.png’
'auto' : true, //选定文件后是否自动上传,默认false
'folder' : '/uploads' //要上传到的服务器路径,默认‘/’
'muti' : true, //是否允许同时上传多文件,默认false
'fileDesc' : 'rar文件或zip文件' //出现在上传对话框中的文件类型描述
'fileExt' : '*.rar;*.zip', //控制可上传文件的扩展名,启用本项时需同时声明fileDesc
'sizeLimit': 86400 //控制上传文件的大小,单位byte
'simUploadLimit' :5 //多文件上传时,同时上传文件数目限制