文件上传：swfupload.js、blueimp-file-upload
一、swfupload
1.下载swfupload http://code.google.com/p/swfupload/
2.
3.API http://www.cnblogs.com/henw/archive/2012/03/22/2411592.html SWFUpload V2.2.0 API
参考阅读：
http://gxxsite.com/content/view/id/121.html
http://www.5icool.org/a/201312/a3410.html
http://www.91ctc.com/article/article-313.html
未完成。。。
二、jQuery-File-Upload-9.11.2 这个测试成功。
http://blog.csdn.net/lengxue789/article/details/43169965 重要 2015-11-11
http://www.bootcdn.cn/blueimp-file-upload/
https://github.com/blueimp/jQuery-File-Upload/tags
http://biancheng.dnbcw.info/jquery/463416.html 阅读
http://www.cnblogs.com/silentjesse/p/3770253.html 阅读 ie9兼容问题
http://www.jb51.net/article/59027.htm 阅读 ie9兼容问题
http://blueimp.github.io/jQuery-File-Upload/jquery-ui.html
http://www.jianshu.com/p/a01a09a4c56e 文档翻译
https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support api
PHP输出图片文件：
<? header("content-type:image/jpeg"); $url="/home/monelife/public_html/uucat.com/Tulips.jpg"; $imgfile = fopen($url,"r"); echo fread($imgfile,filesize($url)); fclose($imgfile); ?>
PHP保存上传文件：
<input type="file" id="test_file" name="test_file" multiple> <? if($_SERVER['REQUEST_METHOD']=='POST') { move_uploaded_file($_FILES["test_file"]["tmp_name"], "/home/monelife/public_html/uucat.com/" . $_FILES["test_file"]["name"]); ?>
正文：
文件1.php
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> <meta http-equiv="Pragma" content="no-cache"> <script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script> <!-- bootstrap库 --> <link href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet"> <script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script> </head> <body> <link rel="stylesheet" href="css/jquery.fileupload.css"> <link rel="stylesheet" href="css/jquery.fileupload-ui.css"> <script src="js/vendor/jquery.ui.widget.js"></script> <script src="js/jquery.fileupload.js"></script> <script src="js/jquery.iframe-transport.js"></script> <script type="text/javascript"> $(function() { //url：后台提交的地址 //fileuploadprogress：主要是进度条的修改 //fileuploaddone：上传结束后执行的操作 $("#test_file").fileupload({ //url: '__CONTROLLER__/uploadImg', url: 'upload.php', sequentialUploads: true }).bind('fileuploadprogress', function (e, data) { var progress = parseInt(data.loaded / data.total * 100, 10); $("#test_progress").css('width',progress + '%'); $("#test_progress").html(progress + '%'); }).bind('fileuploaddone', function (e, data) { $("#test_show").attr("src",""+data.result); $("#test_upload").css({display:"none"}); $("#test_cancle").css({display:""}); }); }); </script> <div class="row fileupload-buttonbar" style="padding-left:15px;"> <div class="thumbnail col-sm-6"> <img id="test_show" style="height:180px;margin-top:10px;margin-bottom:8px;" src="" data-holder-rendered="true"> <div class="progress progress-striped active" role="progressbar" aria-valuemin="10" aria-valuemax="100" aria-valuenow="0"><div id="test_progress" class="progress-bar progress-bar-success" style="width:0%;"></div></div> <div class="caption" align="center"> <span id="test_upload" class="btn btn-primary fileinput-button"> <span>上传</span> <input type="file" id="test_file" name="test_file" multiple> </span> <a id="test_cancle" href="javascript:void(0)" class="btn btn-warning" role="button" onclick="cancleUpload('weixin')" style="display:none">删除</a> </div> </div> </div> </body> </html>
文件2 upload.php
<? if($_SERVER['REQUEST_METHOD']=='POST') { move_uploaded_file($_FILES["test_file"]["tmp_name"], "/home/monelife/public_html/uucat.com/" . $_FILES["test_file"]["name"]); $imgfileName = $_FILES["test_file"]["name"]; echo "http://www.uucat.com/".$imgfileName; /* header("content-type:image/jpeg"); $url="/home/monelife/public_html/uucat.com/".$imgfileName; $imgfile = fopen($url,"r"); echo fread($imgfile,filesize($url)); fclose($imgfile);*/ } ?>
jquery.fileupload-angular.js 的300行，看如下代码：
fileuploadadd
fileuploadsubmit
fileuploadsend
fileuploaddone
fileuploadfail
fileuploadalways
fileuploadprogress//进度条的修改
fileuploaddone//上传完毕
fileuploadprogressall
fileuploadstart
fileuploadstop
fileuploadchange
fileuploadpaste
fileuploaddrop
fileuploaddragover
fileuploadchunksend
fileuploadchunkdone
fileuploadchunkfail
fileuploadchunkalways
fileuploadprocessstart
fileuploadprocess
fileuploadprocessdone
fileuploadprocessfail
fileuploadprocessalways
fileuploadprocessstop
-------------------------
其他关于文件上传的，还没看
1.fineuploader:
http://fineuploader.com/
http://www.bootcdn.cn/file-uploader/
http://blog.csdn.net/sadfishsc/article/details/7342547
http://bbs.csdn.net/topics/390674987 通过file文件选择图片预览功能（这个要看）2015-11-30
http://www.cnblogs.com/tianguook/p/4230642.html jquery实现上传文件大小类型的验证