js ajaxfileupload.js上传报错的解决方法


Posted in Javascript onMay 05, 2016

相信大家在工作中经常用到文件上传的操作,因为我是搞前端的,所以这里主要是介绍ajax在前端中的操作。代码我省略的比较多,直接拿js那里的

$.ajaxFileUpload({
   url:'www.coding/mobi/file/uploadSingleFile.html',//处理图片脚本
   secureuri :false,
   fileElementId :'image2',//file控件id。就是input type="file" id="image2"
   dataType : 'json',
   success : function (data, status){
    console.log(data);
   },
   error: function(data, status, e){
    alert(e);
   }
   })

按照教程,这样子上传的话是没有问题的,可是它一直有一个报错。报的是什么错有点忘了,不好意思 ,因为用完很久才记得补回这篇文章,但是要修改它的源码,那个错误就可以解决了 

它源码的最后一段是这样子的

uploadHttpData: function( r, type ) {
 var data = !type;
 data = type == "xml" || data ? r.responseXML : r.responseText;
 // If the type is "script", eval it in global context
 if ( type == "script" )
  jQuery.globalEval( data );
 // Get the JavaScript object, if JSON is used.
 if ( type == "json" )
  eval( "data = " + data );
 // evaluate scripts within html
 if ( type == "html" )
  jQuery("<div>").html(data).evalScripts();
  //alert($('param', data).each(function(){alert($(this).attr('value'));}));
 return data;
 }

将这一段改为这样子

uploadHttpData: function( r, type ) {
 var data = !type;
 data = type == "xml" || data ? r.responseXML : r.responseText;
 // If the type is "script", eval it in global context
 if ( type == "script" )
  jQuery.globalEval( data );
 // Get the JavaScript object, if JSON is used.
 if ( type == "json" ){
  // 因为json数据会被<pre>标签包着,所以有问题,现在添加以下代码,
  // update by hzy
  var reg = /<pre.+?>(.+)<\/pre>/g; 
  var result = data.match(reg);
  result = RegExp.$1;
  // update end
  data = $.parseJSON(result);
  // eval( "data = " + data );
 // evaluate scripts within html
 }
 if ( type == "html" )
  jQuery("<div>").html(data).evalScripts();
  //alert($('param', data).each(function(){alert($(this).attr('value'));}));
 return data;
 }

这样就可以正常使用了。

另一种情况:ajaxFileUpload 报这错jQuery.handleError is not a function

版本1.4.2之前的版本才有handlerError方法,例子里使用的Jquery是1.2的,解决方法:

为了能够继续使用ajaxfileupload上传我们的附件,只好将下面代码拷进我们的项目中的ajaxfileupload.js文件中

handleError: function( s, xhr, status, e )  { 
  // If a local callback was specified, fire it 
    if ( s.error ) { 
     s.error.call( s.context || s, xhr, status, e ); 
    } 
 
    // Fire the global callback 
    if ( s.global ) { 
     (s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError", [xhr, s, e] ); 
    } 
 }

更多精彩内容请参考专题《ajax上传技术汇总》,《javascript文件上传操作汇总》和《jQuery上传操作汇总》进行学习。

以上就是面对ajaxupload.js上传报错问题的解决方法,希望能帮助大家解决困难,也希望大家继续关注三水点靠木更多精彩内容。

Javascript 相关文章推荐
InnerHtml和InnerText的区别分析
Mar 13 Javascript
基于jQuery的消息提示插件 DivAlert之旅(二)
Apr 01 Javascript
使用jquery实现的一个图片延迟加载插件(含图片延迟加载原理)
Jun 05 Javascript
js不能获取隐藏的div的宽度只能先显示后获取
Sep 04 Javascript
js实现(全选)多选按钮的方法【附实例】
Mar 30 Javascript
详解JavaScript中this关键字的用法
May 26 Javascript
让你一句话理解闭包(简单易懂)
Jun 03 Javascript
手机Web APP如何实现分享多平台功能
Aug 19 Javascript
JS绘制微信小程序画布时钟
Dec 24 Javascript
微信小程序之蓝牙的链接
Sep 26 Javascript
基于JS实现简单滑块拼图游戏
Oct 12 Javascript
Vue切换div显示隐藏,多选,单选代码解析
Jul 14 Javascript
javascript执行环境及作用域详解
May 05 #Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
May 05 #Javascript
Bootstrap嵌入jqGrid,使你的table牛逼起来
May 05 #Javascript
Struts2+jquery.form.js实现图片与文件上传的方法
May 05 #Javascript
使用jquery.form.js实现图片上传的方法
May 05 #Javascript
探讨:JavaScript ECAMScript5 新特性之get/set访问器
May 05 #Javascript
浅析JS异步加载进度条
May 05 #Javascript
You might like
浅析php面向对象public private protected 访问修饰符
2013/06/30 PHP
利用浏览器的Javascript控制台调试PHP程序
2014/01/08 PHP
jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码
2014/10/15 PHP
PHP中实现crontab代码分享
2015/03/26 PHP
微信获取用户地理位置信息的原理与步骤
2015/11/12 PHP
PHP实现读取文件夹及批量重命名文件操作示例
2019/04/15 PHP
JavaScript Accessor实现说明
2010/12/06 Javascript
js对数字的格式化使用说明
2011/01/12 Javascript
JavaScript ECMA-262-3 深入解析.第三章.this
2011/09/28 Javascript
基于jQuery的input输入框下拉提示层(自动邮箱后缀名)
2012/06/14 Javascript
JavaScript中的面向对象介绍
2012/06/30 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
2013/02/05 Javascript
JS和JQ的event对象区别分析
2014/11/24 Javascript
使用JS获取当前地理位置方法汇总
2014/12/18 Javascript
jquery不常用方法汇总
2015/07/26 Javascript
jquery自定义右键菜单、全选、不连续选择
2016/03/01 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
JQuery异步提交表单与文件上传功能示例
2017/01/12 Javascript
Jquery树插件zTree实现菜单树
2017/01/24 Javascript
JavaScript中一些特殊的字符运算
2017/08/17 Javascript
vue 虚拟dom的patch源码分析
2018/03/01 Javascript
深入理解移动前端开发之viewport
2018/10/19 Javascript
Python求两个圆的交点坐标或三个圆的交点坐标方法
2018/11/07 Python
python3 map函数和filter函数详解
2019/08/26 Python
详解python UDP 编程
2020/08/24 Python
python 线程的五个状态
2020/09/22 Python
HTML5中如何显示视频呢 HTML5视频播放demo
2013/06/08 HTML / CSS
医院实习介绍信
2014/01/12 职场文书
荷叶圆圆教学反思
2014/02/01 职场文书
国际金融专业自荐信
2014/07/05 职场文书
2016年元旦致辞
2015/08/01 职场文书
大学生受助感言
2015/08/01 职场文书
通知怎么写?
2019/04/17 职场文书
基于PostgreSQL/openGauss 的分布式数据库解决方案
2021/12/06 PostgreSQL
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
2022/04/06 Vue.js
MySQL库表太大怎么办? 数据库分库分表项目实践
2022/04/11 MySQL