之前上傳圖片一直遇到問題，1600*799 大小570Kb上傳居然分批次，很奇葩，結果是因為沒分片，之前不了解webuploader，現在多少知道了，感謝下文

插件下載地址：http://download.csdn.NET/my

API文檔：http://fex.baidu.com/webuploader/

引入：

<link rel="stylesheet" href="js/diyUpload/css/webuploader.css"/>
<link rel="stylesheet" href="js/diyUpload/css/diyUpload.css"/>

??? <script src="js/jQuery-1.11.2.min.js"></script>
??? <script src="js/diyUpload/js/webuploader.html5only.min.js"></script>
??? <script src="js/diyUpload/js/diyUpload.js"></script>

html頁面：

?? ???? <!--上傳圖片-->
?? ??? ?<div id="box">
?? ??? ? <div id="test" ></div>
?? ??? ?</div>
?? ??? ?
?? ??? ?<!--上傳文件-->
?? ??? ?<div id="demo">
?? ??? ??? ?<div id="as" ></div>
?? ??? ?</div>

js：

//?? ??? ?上傳圖片
?? ?? $('#test').diyUpload({
?? ??? ??? ?url:'server/fileupload.PHP',
?? ??? ??? ?success:function( data ) {
?? ??? ??? ??? ?console.info( data );
?? ??? ??? ?},
?? ??? ??? ?error:function( err ) {
?? ??? ??? ??? ?console.info( err );?? ?
?? ??? ??? ?}
??????? });
?? ??? ?
//?? ??? ?上傳文件
?? ??? ?$('#as').diyUpload({
?? ??? ??? ?url:'server/fileupload.php',
?? ??? ??? ?success:function( data ) {
?? ??? ??? ??? ?console.info( data );
?? ??? ??? ?},
?? ??? ??? ?error:function( err ) {
?? ??? ??? ??? ?console.info( err );?? ?
?? ??? ??? ?},
?? ??? ??? ?buttonText : '選擇文件',
?? ??? ??? ?chunked:true,
?? ??? ??? ?// 分片大小
?? ??? ??? ?chunkSize:512 * 1024,
?? ??? ??? ?//最大上傳的文件數量, 總文件大小,單個文件大小(單位字節);
?? ??? ??? ?fileNumLimit:50,
?? ??? ??? ?fileSizeLimit:500000 * 1024,
?? ??? ??? ?fileSingleSizeLimit:50000 * 1024,
?? ??? ??? ?accept: {}
?? ??? ?});

總結

以上是生活随笔為你收集整理的多图片上传，多文件上传。插件diyUpload.js的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。