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 相关文章推荐
jquery 全局AJAX事件使用代码
Nov 05 Javascript
基于jQuery实现图片的前进与后退功能
Apr 24 Javascript
SuperSlide2实现图片滚动特效
Jun 20 Javascript
全面解析JS字符串和正则表达式中的match、replace、exec等函数
Jul 01 Javascript
浅析上传头像示例及其注意事项
Dec 14 Javascript
Jquery Easyui进度条组件Progress使用详解(8)
Mar 26 Javascript
js清除浏览器缓存的几种方法
Mar 15 Javascript
彻底解决 webpack 打包文件体积过大问题
Jul 07 Javascript
vue项目中公用footer组件底部位置的适配问题
May 10 Javascript
jQuery实现的点击图片居中放大缩小功能示例
Jan 16 jQuery
vue项目中使用scss的方法步骤
May 16 Javascript
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
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中的HashTable结构详解
2013/06/13 PHP
PHP查询网站的PR值
2013/10/30 PHP
PHP 断点续传实例详解
2017/11/11 PHP
PHP共享内存使用与信号控制实例分析
2018/05/09 PHP
在Laravel 中实现是否关注的示例
2019/10/22 PHP
php实现记事本案例
2020/10/20 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
jQuery中 noConflict() 方法使用
2013/04/25 Javascript
Javascript 遮罩层和加载效果代码
2013/08/01 Javascript
jquery cookie实现的简单换肤功能适合小网站
2013/08/25 Javascript
jquery+ajax验证不通过也提交表单问题处理
2014/12/12 Javascript
JavaScript中的闭包(Closure)详细介绍
2014/12/30 Javascript
jQuery实现模拟marquee标签效果
2015/07/14 Javascript
手机端图片缩放旋转全屏查看PhotoSwipe.js插件实现
2016/08/25 Javascript
浅谈JS中的三种字符串连接方式及其性能比较
2016/09/02 Javascript
bootstrap vue.js实现tab效果
2017/02/07 Javascript
AngularJS表单验证功能分析
2017/05/26 Javascript
Vue登录注册并保持登录状态的方法
2018/08/17 Javascript
解决angular2 获取到的数据无法实时更新的问题
2018/08/31 Javascript
JavaScript JMap类定义与使用方法示例
2019/01/22 Javascript
vue 解决路由只变化参数页面组件不更新问题
2019/11/05 Javascript
vue 项目中当访问路由不存在的时候默认访问404页面操作
2020/08/31 Javascript
[04:11]2014DOTA2国际邀请赛 CIS遗憾出局梦想不灭
2014/07/09 DOTA
基于python的Tkinter编写登陆注册界面
2017/06/30 Python
python MysqlDb模块安装及其使用详解
2018/02/23 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
Python3基础教程之递归函数简单示例
2019/06/07 Python
树莓派实现移动拍照
2019/06/22 Python
为什么称python为胶水语言
2020/06/16 Python
pycharm永久激活超详细教程
2020/10/29 Python
HTML5 video 视频标签使用介绍
2014/02/03 HTML / CSS
解释i节点在文件系统中的作用
2013/11/26 面试题
给排水工程师岗位职责
2013/11/21 职场文书
2014的自我评价
2014/01/13 职场文书
36个正则表达式(开发效率提高80%)
2021/11/17 Javascript
Mysql存储过程、触发器、事件调度器使用入门指南
2022/01/22 MySQL