javascript “异步”上传文件
var Uploader = (function(){/** * @param options * @param callback * @returns * @desc 创建iframe */var iframe = function(options) {options = options || {id : 'iframe' + Math.random(),name : 'iframe',src : ''};var iframe;try{iframe = document.createElement('<iframe name=' + options.name + '>');}catch(e) {iframe = document.createElement('iframe');iframe.name = options.name;}options.id && (iframe.id = options.id);iframe.src = options.src;iframe.style.cssText = options.cssText;return iframe;};/** * @param {file} * @return {} * @desc 上传文件 */function Uploader(file){var name,hidden;var uuid = Uploader.uuid++;this.state = 0;this.file = file;this.form = file.form;name = 'upload_file_'+ uuid;this.iframe = iframe({name:name,src:'blank.html',cssText:'display:none;'});document.body.appendChild(this.iframe);this.form.target = name;};Uploader.uuid = 0;Uploader.prototype = {upload:function(callback){//生成JSONP回调var ts,jsonp,uploader,action,jsonpCallback;ts = (new Date()).getTime();jsonp = 'jsonp' + ts;uploader = this;window[jsonp] = function(ret){callback(ret);uploader.state = 0;};action = this.form.action;jsonpCallback = 'parent.' + jsonp; if(action.indexOf('callback') > -1){action = action.replace(/jsonp\d+/,jsonpCallback);}else{action += (action.indexOf('?') > -1 ? '&callback=' : '?callback=') + jsonpCallback;}this.form.action = action;this.state = 1;//开始上传this.form.submit();return jsonp;},readyState:function(){return this.state;},cancel:function(jsonp){typeof window[jsonp] && (window[jsonp] = function(){});}};return Uploader;})();这种上传文件的方法不会刷新页面，类似于Ajax。原理就是将要提交的表单target属性和页面中隐藏的iframe的name属性相等。实际就是iframe做提交
而iframe本身是不可见的，所以用户不会看到页面刷新的效果，请求成功或者失败服务器端都要返回一个script元素，该元素里面有一个
发送请求时候传递的回调函数callback，请求成功或者失败就会执行callback函数把服务器处理的结果作为回调函数传递到前端。
?
页面调用：
?
var file = document.getElementById('file'),uploader;uploader = new Uploader(file);uploader.upload(function(data){ //成功或失败处理});??