微信扫一扫打赏支持

js插件---IUpload文件上传插件(包括图片)

js插件---IUpload文件上传插件(包括图片)

一、总结

一句话总结:上传插件找到真正上传位置的代码,这样就可以知道整个上传插件的逻辑了,

找资料还是github+官方

 

1、如何在js中找到真正控制上传的那段代码?

a、上传的话首先考虑是不是用的ajax,结果在相关的js里面搜索'ajax'字眼(或者get,post),没找到

b、根据上面就知道不是用的jquery的ajax,那可能是用的原生的ajax,所以可以搜'XMLHttpRequest'或者'upload'(上传插件肯定要上传,上传的话有极高概率出现upload字眼)

找到upload

    function upload(file) {
        file.stage = 'uploadIng';
        opts.stageChange(file);
        var xhr = createXMLHttpRequest();
        xhr.open('POST', opts.url, true);
        var upload = xhr.upload;
        if (upload) {
            upload.addEventListener('progress', function (e) {
                progress(e, file);
            }, false);
        }
        xhr.addEventListener('readystatechange', function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                if (!opts.multithreading) {
                    if (queue.length > 1) {
                        queue.shift();
                        loadOk--;
                        upload_(queue[0]);
                    }
                }
                file.responseText = xhr.responseText;
                opts.complete(file);
            }
        }, false);
        var formData = new FormData();
        formData.append('FileData', file);
        xhr.send(formData);
        startTime = new Date().getTime();
    }

    function upload_(file) {
        upload(file);
    }

然后看其它位置出现的upload字眼可以知道哪里调用了这个upload函数来上传

    function setImageTpl(file, fileReaderiImage, newImage) {
        var data = {};
        data.file = file;
        data.fileReaderiImage = fileReaderiImage;
        data.newImage = newImage;
        data.fileSize = getFileSize(file);
        data.fileType = getFileType(file);
        opts.setImageTpl(data);
        loadOk++;
        if (loadOk == queue.length && !opts.multithreading) {
            upload(queue[0]);
        }
        if (opts.multithreading) {
            upload(data.file);
        }
    }

    function setOtherTpl(file) {
        var data = {};
        data.file = file;
        data.fileSize = getFileSize(file);
        data.fileType = getFileType(file);
        opts.setOtherTpl(data);

        var type = getFileType(file);
        if (opts.Knowntype[type] != undefined && opts.Knowntype[type] != 'undefined') {
            var thisLi = $('#uList li').eq(data.file.index);

            thisLi.find('.image img').attr('src', opts.Knowntype[type]);

        }
        loadOk++;
        if (loadOk == queue.length && !opts.multithreading) {
            upload(queue[0]);
        }
        if (opts.multithreading) {
            upload(file);
        }
    }

发现了setImageTpl和setOtherTpl调用了upload函数

setImageTpl:上传图片

setOtherTpl:上传文件

所以就知道是这两个函数控制的上传图片和文件,所以现在思路就比较清晰了,然后我们在index的js代码中找到了setImageTpl和setOtherTpl

// 设置图片类型文件View模板
setImageTpl : function(data) {
    var tpl = opts.tpl('image', 1);
    $('#uList').html($('#uList').html() + tpl);
    var thisLi = $('#uList li').eq(data.file.index);
    thisLi.find('.image img').attr('src', data.fileReaderiImage.target.result);
    thisLi.find('.fileName').text(data.file.name);
    thisLi.find('.imageSize text').text(data.newImage.width + ' X ' + data.newImage.height);
    thisLi.find('.fileSize text').text(data.fileSize);
    thisLi.find('.fileType text').text(data.fileType);
    
},
// 设置其他文件类型View模板
setOtherTpl : function(data) {
    var tpl = opts.tpl('other', 1);
    $('#uList').html($('#uList').html() + tpl);
    var thisLi = $('#uList li').eq(data.file.index);
    thisLi.find('.fileName text').text(data.file.name);
    thisLi.find('.fileSize text').text(data.fileSize);
    thisLi.find('.fileType text').text(data.fileType);
},

所以就知道了整个上传的逻辑和各个主要函数的功能了,那么这个插件就好用了

 

 

 

二、IUpload文件上传插件(包括图片)

百度盘下载地址:

链接:https://pan.baidu.com/s/1UAZ9Bt-b0JbUMJtGgmat7A 密码:6dmc

 

1、截图

 

 

2、代码

index.html

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>lUpload-Demo</title>
  6     <link rel="stylesheet" href="../assets/css/new.css">
  7     <link rel="stylesheet" href="../assets/css/demo.css">
  8 </head>
  9 <body>
 10 <header>
 11     <nav>
 12     <div id="line">
 13         <span id="title">
 14             lUpload
 15         </span>
 16         <div id="right">
 17             <span></span>
 18         </div>
 19     </div>
 20 
 21     </nav>
 22 </header>
 23 <div id="blueBack">
 24     <span>这是一款多功能的上传插件</span>
 25 </div>
 26     <div id="center">
 27         <div id="title">
 28         <h1>Demo</h1>
 29             <span>您可以尝试文件拖拽,使用QQ截屏工具,然后激活窗口后粘贴,或者点击添加图片按钮,来体验此demo.</span>
 30         </div>
 31         <div id="event">
 32             <div id="dashed">
 33                 <div id="topImg">
 34                     
 35                 </div>
 36                 <div id="middle">
 37                     点击上传
 38                     <input type="file" id="selectFile">
 39                     <lable for="selectFile"></lable>
 40                 </div>
 41                 <div id="bottom">
 42                     将文件拖到这里试试?
 43                 </div>
 44             </div>
 45         </div>
 46         <ul id="uList">
 47 <!--             <li>
 48                 <div class="image">
 49                     <img src="./assets/image/aa.jpg" alt="">
 50                 </div>
 51                 <div class="uploadInfo">
 52                     <span class="fileName">文件名称: <con>ssad</con></span>
 53                     <span class="imageSize">图片尺寸: <con>ssad</con></span>
 54                     <span class="fileSize">文件大小: <con>ssad</con></span>
 55                     <span class="speed">上传速度: <con>ssad</con></span>
 56                     <span class="loaded">上传详情: <con>zzzz</con></span>
 57                     <span class="stage">
 58                         上传状态: <con>ssad</con>
 59                     </span>
 60                     <div class="progress">
 61                         <div class="progress-bar progress-bar-info progress-bar-striped active" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;">
 62                             60%
 63                           </div>
 64                     </div>
 65                 </div>
 66             </li>  -->
 67 
 68         </ul>
 69     </div>
 70     <!-- 新 Bootstrap 核心 CSS 文件 -->
 71     <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
 72 
 73     <!-- 可选的Bootstrap主题文件(一般不用引入) -->
 74     <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
 75 
 76     <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
 77     <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
 78 
 79     <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
 80     <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
 81     <script type="text/javascript" src="../assets/js/lUpload.js"></script>
 82 <script>
 83 // 说明 $('#drop').dropFile为拖拽上传 $('#drop').pasteFile为粘贴上传 $('#drop').selectFile 为选择上传
 84         // 拖拽上传
 85     var opts = {
 86         url : './upload.php',
 87         maxfiles: 111 , // 单次上传的数量
 88         maxfilesize : 11,  // 单个文件允许的大小 (M)
 89         multithreading : true, // true为同时上传false为队列上传
 90         type : [], // 限制上传的类型
 91         Knowntype : {'other':'./assets/image/other.jpg', 'html':'./assets/image/html.png'}, // 自定义其他文件的缩略图
 92         tpl : function(type) { // 自定义模板
 93             var imageTpl = '<li>\
 94                 <div class="image">\
 95                     <img src="./assets/image/other.jpg" alt="">\
 96                 </div>\
 97                 <div class="uploadInfo">\
 98                     <span class="fileName">文件名称: <text>ssad</text></span>\
 99                     <span class="imageSize">图片尺寸: <text>ssad</text></span>\
100                     <span class="fileSize">文件大小: <text>ssad</text></span>\
101                     <span class="fileType">文件类型: <text>ssad</text></span>\
102                     <span class="speed">上传速度: <text>ssad</text></span>\
103                     <span class="loaded">上传详情: <text>zzzz</text></span>\
104                     <span class="stage">\
105                         上传状态: <text>等待上传</text>\
106                     </span>\
107                     <div class="progress" style="display:none">\
108                         <div class="progress-bar progress-bar-info progress-bar-striped active" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;" id="progress">\
109                             60%\
110                           </div>\
111                     </div>\
112                 </div>\
113             </li>';
114             var otherTpl = '<li>\
115                 <div class="image">\
116                     <img src="./assets/image/other.jpg" alt="">\
117                 </div>\
118                 <div class="uploadInfo">\
119                     <span class="fileName">文件名称: <text>ssad</text></span>\
120                     <span class="fileSize">文件大小: <text>ssad</text></span>\
121                     <span class="fileType">文件类型: <text>ssad</text></span>\
122                     <span class="speed">上传速度: <text>ssad</text></span>\
123                     <span class="loaded">上传详情: <text>zzzz</text></span>\
124                     <span class="stage">\
125                         上传状态: <text>等待上传</text>\
126                     </span>\
127                     <div class="progress" style="display:none">\
128                         <div class="progress-bar progress-bar-info progress-bar-striped active" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;" id="progress">\
129                             60%\
130                           </div>\
131                     </div>\
132                 </div>\
133             </li>';
134             if(type == 'image') {
135                 return imageTpl;
136             } else if(type == 'other') {
137                 return otherTpl;
138             }
139         },
140         // result 结构 {thisDom: 当前被上传的节点, progress: 进度, speed: "网速", loaded: "已上传的大小 992 KB"}
141         dynamic : function(result) { // 返回网速及上传百分比
142             result.thisDom.find('#progress').css('width', result.progress + '%').html(result.progress + '%');
143             result.thisDom.find('.speed').text("网速:" + result.speed + " K\/S")
144             result.thisDom.find('.loaded text').text(result.loaded + ' / ' + result.total)
145 
146         },
147         complete : function(file) { // 上传完成后调用的
148             var uList = $('#uList li').eq(file.index);
149 
150             uList.find('.stage text').html('上传完成!');
151 
152             // console.log('第' + file.index + '文件上传完成!');
153         },
154         // 设置图片类型文件View模板
155         setImageTpl : function(data) {
156             var tpl = opts.tpl('image', 1);
157             $('#uList').html($('#uList').html() + tpl);
158             var thisLi = $('#uList li').eq(data.file.index);
159             thisLi.find('.image img').attr('src', data.fileReaderiImage.target.result);
160             thisLi.find('.fileName').text(data.file.name);
161             thisLi.find('.imageSize text').text(data.newImage.width + ' X ' + data.newImage.height);
162             thisLi.find('.fileSize text').text(data.fileSize);
163             thisLi.find('.fileType text').text(data.fileType);
164             
165         },
166         // 设置其他文件类型View模板
167         setOtherTpl : function(data) {
168             var tpl = opts.tpl('other', 1);
169             $('#uList').html($('#uList').html() + tpl);
170             var thisLi = $('#uList li').eq(data.file.index);
171             thisLi.find('.fileName text').text(data.file.name);
172             thisLi.find('.fileSize text').text(data.fileSize);
173             thisLi.find('.fileType text').text(data.fileType);
174         },
175         // 上传状态改变时触发
176         stageChange : function(file) {
177             var uList = $('#uList li').eq(file.index);
178             uList.find('.progress').show();
179             uList.find('.stage text').html('正在被上传');
180             // console.log(file.index + '正在被上传');
181         } // 当开启队列上传时可以知道那个文件正在被上传
182 
183     };
184     $('#event').dropFile(opts);    
185     $('#event #selectFile').selectFile(opts);    
186     $('#event').pasteFile(opts);    
187 </script>
188 </body>
189 </html>

 

IUpload.js

  1 /**
  2  * Author : dsphper
  3  * Email : dsphper@gmail.com
  4  * Version : 1.0.1
  5  * Licensed under the MIT license:
  6  *    http://www.opensource.org/licenses/mit-license.php
  7  *    Project home:
  8  *    https://github.com/dsphper/lUpload
  9  */
 10 !(function ($) {
 11     var opts = {},
 12         defaultOpts = {
 13             url: '', // 后台接受地址
 14             maxfiles: 2, // 最大上传文件数
 15             maxfilesize: 2, // 最大的文件大小
 16             dynamic: function (complete, speed) {
 17             },
 18             error: function (error, file, i) {
 19                 alert(error)
 20             }, // 异常信息接收
 21             multithreading: true, // 是否同时上传
 22             type: [], // 限制上传的类型
 23             dragenter: function (e) {
 24                 return false;
 25             },
 26             dragleave: function (e) {
 27                 return false;
 28             },
 29             dragover: function (e) {
 30                 return false;
 31             },
 32             drop: function (e) {
 33                 return false;
 34             },
 35             dropDefa: function (e) {
 36                 return false;
 37             },
 38             enterDefa: function (e) {
 39                 return false;
 40             },
 41             leaveDefa: function (e) {
 42                 return false;
 43             },
 44             overDefa: function (e) {
 45                 return false;
 46             },
 47             tpl: function () {
 48                 return 'false';
 49             },
 50             setImageTpl: function (file, image, img) {
 51             },
 52             setOtherTpl: function (file) {
 53             },
 54             complete: function (file) {
 55             },
 56             stageChange: function (file) {
 57             }, // 当开启队列上传时可以知道那个文件正在被上传
 58             Knowntype: {'pdf': './image/pdf.jpg', 'html': './image/html.png'},
 59             selectMultiple: true // 允许选择多个文件
 60         },
 61         errorTexts = ["浏览器不支持", "超过最大文件数", "文件大小超过限制", "不允许的上传格式"],
 62         errorCode = {200: 'warning', 201: 'deadly'}, // warning 普通错误 deadly 致命错误
 63         uploadImg = [],
 64         uploadTotal = 0, // 本次操作被放入的文件数
 65         fi = 0, // 记录总共拖入的文件数
 66         thisFile = 0, // 存放当前文件的资源对象
 67         startTime = 0, // 当前文件的上传开始时间
 68         queue = [], // 用于队列上传
 69         loadOk = 0, // 用于记录当前操作放入的文件被加载成功的数目
 70         time = []; // 用于计算每个文件上传的平均网速
 71     // 拖拽上传
 72     $.fn.dropFile = function (userOpts) {
 73         $.event.props.push("dataTransfer");
 74         opts = $.extend({}, defaultOpts, userOpts);
 75         this.bind('dragenter', dragenter).bind('dragleave', dragleave).bind('dragover', dragover).bind('drop', drop);
 76         $(document).bind('drop', dropDefa).bind('dragover', overDefa).bind('dragleave', leaveDefa).bind('dragenter', enterDefa);
 77     }
 78     // 粘贴上传
 79     $.fn.pasteFile = function (userOpts) {
 80         $.event.props.push("clipboardData");
 81         opts = $.extend({}, defaultOpts, userOpts);
 82         var _this = this;
 83         this.bind('mouseover', function () {
 84             _this.bind('paste', pasteHand);
 85         });
 86         this.bind('mouseout', function () {
 87             _this.unbind('paste', pasteHand);
 88         });
 89 
 90     }
 91     // 选择上传
 92     $.fn.selectFile = function (userOpts) {
 93         opts = $.extend({}, defaultOpts, userOpts);
 94         if ($(this).attr('multiple') == undefined && opts.selectMultiple) {
 95             $(this).attr('multiple', 'multiple');
 96         }
 97         $(this).bind('change', function () {
 98             handFiles(this.files)
 99         })
100     }
101     function pasteHand(e) {
102         var clipboard = e.clipboardData;
103         var temp = [];
104         for (var i = 0; i < clipboard.items.length; i++) {
105             temp.push(clipboard.items[i].getAsFile());
106         }
107         ;
108         handFiles(temp);
109         e.preventDefault();
110         e.stopPropagation();
111 
112     }
113 
114     function dragenter(e) {
115         e.dataTransfer.dropEffect = "copy";
116         e.preventDefault();
117         e.stopPropagation();
118 
119     }
120 
121     function dragleave(e) {
122         e.dataTransfer.dropEffect = "copy";
123         e.preventDefault();
124         e.stopPropagation();
125 
126     }
127 
128     function dragover(e) {
129         e.dataTransfer.dropEffect = "copy";
130         e.preventDefault();
131         e.stopPropagation();
132 
133     }
134 
135     function drop(e) {
136         handFiles(e.dataTransfer.files);
137         e.dataTransfer.dropEffect = "copy";
138         e.preventDefault();
139         e.stopPropagation();
140     }
141 
142     function dropDefa(e) {
143         opts.dropDefa(e);
144         e.dataTransfer.dropEffect = "none";
145         e.preventDefault();
146         e.stopPropagation();
147     }
148 
149     function enterDefa(e) {
150         opts.enterDefa(e);
151         e.dataTransfer.dropEffect = "none";
152         e.preventDefault();
153         e.stopPropagation();
154     }
155 
156     function leaveDefa(e) {
157         opts.leaveDefa(e);
158         e.dataTransfer.dropEffect = "none";
159         e.preventDefault();
160         e.stopPropagation();
161     }
162 
163     function overDefa(e) {
164         opts.overDefa(e);
165         e.dataTransfer.dropEffect = "none";
166         e.preventDefault();
167         e.stopPropagation();
168     }
169 
170     function progress(e, file) {
171         if (e.lengthComputable) {
172             //计算网速
173             var nowDate = new Date().getTime();
174             var x = (e.loaded) / 1024;
175             var y = (nowDate - startTime) / 1000;
176             time.push((x / y).toFixed(2));
177             if ((e.loaded / e.total) * 100 == 100) {
178                 var avg = 0;
179                 for (var i = 0; i < time.length; i++) {
180                     avg += parseInt(time[i]);
181                 }
182                 ;
183                 // 求出平均网速
184             }
185             var result = {};
186             result.thisDom = $('#uList li').eq(file.index);
187             result.progress = Math.round((e.loaded / e.total) * 100);
188             result.speed = (x / y).toFixed(2);
189             result.loaded = getFileSize({size: e.loaded});
190             result.total = getFileSize({size: e.total});
191             opts.dynamic(result);
192         } else {
193             alert('无法获得文件大小')
194         }
195     }
196 
197     function getFileSize(file) {
198         var filesize = file.size;
199         if (filesize >= 1073741824) {
200             filesize = Math.round(filesize / 1073741824 * 100) / 100 + ' GB';
201         } else if (filesize >= 1048576) {
202             filesize = Math.round(filesize / 1048576 * 100) / 100 + ' MB';
203         } else if (filesize >= 1024) {
204             filesize = Math.round(filesize / 1024 * 100) / 100 + ' KB';
205         } else {
206             filesize = filesize + ' Bytes';
207         }
208         return filesize;
209     }
210 
211     function setImageTpl(file, fileReaderiImage, newImage) {
212         var data = {};
213         data.file = file;
214         data.fileReaderiImage = fileReaderiImage;
215         data.newImage = newImage;
216         data.fileSize = getFileSize(file);
217         data.fileType = getFileType(file);
218         opts.setImageTpl(data);
219         loadOk++;
220         if (loadOk == queue.length && !opts.multithreading) {
221             upload(queue[0]);
222         }
223         if (opts.multithreading) {
224             upload(data.file);
225         }
226     }
227 
228     function setOtherTpl(file) {
229         var data = {};
230         data.file = file;
231         data.fileSize = getFileSize(file);
232         data.fileType = getFileType(file);
233         opts.setOtherTpl(data);
234 
235         var type = getFileType(file);
236         if (opts.Knowntype[type] != undefined && opts.Knowntype[type] != 'undefined') {
237             var thisLi = $('#uList li').eq(data.file.index);
238 
239             thisLi.find('.image img').attr('src', opts.Knowntype[type]);
240 
241         }
242         loadOk++;
243         if (loadOk == queue.length && !opts.multithreading) {
244             upload(queue[0]);
245         }
246         if (opts.multithreading) {
247             upload(file);
248         }
249     }
250 
251     function getImageInfo(file, image) {
252         var img = new Image();
253         img.src = image.target.result;
254         img.addEventListener('load', function (e) {
255             setImageTpl(file, image, img);
256         }, false);
257     }
258 
259     function readerFile(file) {
260         var reader = new FileReader();
261         reader.addEventListener('load', function (e) {
262             switchHand(file, e);
263         }, false);
264         reader.readAsDataURL(file);
265     }
266 
267     function filter(file) {
268         var type = !file.type ? 'other' : file.type.split('/')[1];
269         if (type) {
270             var typeIsOk = false;
271             if (opts.type.length > 0) {
272                 for (o in opts.type) {
273                     if (type == opts.type[o]) {
274                         typeIsOk = true;
275                         break;
276                     }
277                 }
278                 if (!typeIsOk) {
279                     opts.error(errorTexts[3], file);
280                     return errorCode['200'];
281                 }
282             }
283 
284         }
285         if (uploadTotal > opts.maxfiles) {
286             opts.error(errorTexts[1], file);
287             return errorCode['201'];
288         }
289         var max_file_size = 1048576 * opts.maxfilesize;
290         if (file.size > max_file_size) {
291             opts.error(errorTexts[2], file);
292             return errorCode['200'];
293         }
294 
295 
296     }
297 
298     function createXMLHttpRequest() {
299         if (window.XMLHttpRequest) {
300             return new XMLHttpRequest();
301         } else {
302             var names = ["msxml", "msxml2", "msxml3", "Microsoft"];
303             for (var i = 0; i < names.length; i++) {
304                 try {
305                     var name = names[i] + ".XMLHTTP";
306                     return new ActiveXObject(name);
307                 } catch (e) {
308                 }
309             }
310         }
311         return null;
312     }
313 
314     function switchHand(file, e) {
315         var type = !file.type ? 'other' : file.type.split('/')[1];
316         if (type == 'jpeg' || type == 'png' || type == 'gif' || type == 'bmp' || type == 'x-icon') {
317             getImageInfo(file, e);
318             return;
319         }
320         setOtherTpl(file);
321         // alert('other');
322     }
323 
324     function upload(file) {
325         file.stage = 'uploadIng';
326         opts.stageChange(file);
327         var xhr = createXMLHttpRequest();
328         xhr.open('POST', opts.url, true);
329         var upload = xhr.upload;
330         if (upload) {
331             upload.addEventListener('progress', function (e) {
332                 progress(e, file);
333             }, false);
334         }
335         xhr.addEventListener('readystatechange', function () {
336             if (xhr.readyState == 4 && xhr.status == 200) {
337                 if (!opts.multithreading) {
338                     if (queue.length > 1) {
339                         queue.shift();
340                         loadOk--;
341                         upload_(queue[0]);
342                     }
343                 }
344                 file.responseText = xhr.responseText;
345                 opts.complete(file);
346             }
347         }, false);
348         var formData = new FormData();
349         formData.append('FileData', file);
350         xhr.send(formData);
351         startTime = new Date().getTime();
352     }
353 
354     function upload_(file) {
355         upload(file);
356     }
357 
358     function handFiles(files) {
359         files = sortFiles(files);
360         uploadTotal = files.length;
361         Array.prototype.push.apply(queue, files);
362         for (var i = 0; i < files.length; i++) {
363             var code = filter(files[i]);
364             if (code == 'deadly') {
365                 return false;
366             } else if (code == 'warning') {
367                 continue;
368             }
369             if (files[i].name == undefined) {
370                 files[i].name = 'null'
371             }
372             files[i].index = fi++;
373             files[i].stage = 'Waiting';
374             readerFile(files[i]);
375             thisFile = files[i];
376         }
377         ;
378     }
379 
380     function sortFiles(files) {
381         var listSize = [];
382         for (var i = 0; i < files.length; i++) {
383             listSize[i] = files[i];
384         }
385         ;
386         for (var i = 0; i < listSize.length; i++) {
387             for (var j = i + 1; j < listSize.length; j++) {
388                 if (listSize[j].size < listSize[i].size) {
389                     var temp = listSize[j];
390                     listSize[j] = listSize[i];
391                     listSize[i] = temp;
392                 }
393             }
394             ;
395         }
396         ;
397 
398         return listSize;
399     }
400 
401     function getFileType(file) {
402         var type = !file.type ? 'other' : file.type.split('/')[1];
403         return type;
404     }
405 })(jQuery)

 

upload.php

 1 <?php
 2 //HTTP上传文件的开关,默认为ON即是开 
 3 ini_set('file_uploads','ON');
 4 //通过POST、GET以及PUT方式接收数据时间进行限制为90秒 默认值:60 
 5 ini_set('max_input_time','90');
 6 //脚本执行时间就由默认的30秒变为180秒 
 7 ini_set('max_execution_time', '180');
 8 //正在运行的脚本大量使用系统可用内存,上传图片给多点,最好比post_max_size大1.5倍 
 9 ini_set('memory_limit','200M');
10 if(!is_dir(dirname(__FILE__) . '/upload')) {
11     mkdir(dirname(__FILE__) . '/upload');
12 }
13 $file_path = dirname(__FILE__) . "/upload/".$_FILES['FileData']['name'];
14 $returnMsg="{status:true}";
15 move_uploaded_file( $_FILES["FileData"]["tmp_name"], $file_path);
16 echo $returnMsg;

 

 

 

 
posted @ 2018-09-05 12:53  范仁义  阅读(1942)  评论(0编辑  收藏  举报