加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

ajaxfileupload.js问题汇总及解决 附修复版下载

发布时间:2020-12-16 01:48:15 所属栏目:百科 来源:网络整理
导读:ajaxfileupload.js问题汇总及解决 附修复版下载 使用Jquery做上传文件处理时,用到了ajaxfileupload.js 这个第三方代码,但是这个js几乎就是半成品,问题很多。现在整理如下并附修复版的ajaxfileupload.js下载。 问题: 1:无法带参数提交,只能上传文件; 2

ajaxfileupload.js问题汇总及解决 附修复版下载

使用Jquery做上传文件处理时,用到了ajaxfileupload.js 这个第三方代码,但是这个js几乎就是半成品,问题很多。现在整理如下并附修复版的ajaxfileupload.js下载。

问题:
1:无法带参数提交,只能上传文件;
2:运行时报:jQuery.handleError is not a function 错误;
3:执行成功后,始终指向error方法处理,无法执行sucess方法;

解决方法:
1:无法带参数提交,只能上传文件;
原作者一定是把这个代码当作练习来写的,只完成了文件提交这个功能。需要对代码做些许修改即可。有两处修改:
第一处是将原createUploadForm: function(id,fileElementId) 方法添加一个data参数,并将data中的数据拼接进去即可。代码如下:

createUploadForm: function(id,fileElementId,data) {
    //create form
    var formId = 'jUploadForm' + id;
    var fileId = 'jUploadFile' + id;
    var form = jQuery('<form action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');
    var oldElement = jQuery('#' + fileElementId);
    var newElement = jQuery(oldElement).clone();
    jQuery(oldElement).attr('id',fileId);
    jQuery(oldElement).before(newElement);
    jQuery(oldElement).appendTo(form);

    // 新增加参数的支持
    if (data) {
        for (var i in data) {
            $('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form);
        }
    }

    //set attributes
    jQuery(form).css('position','absolute');
    jQuery(form).css('top','-1200px');
    jQuery(form).css('left','-1200px');
    jQuery(form).appendTo('body');
    return form;
},

第二处 是调用createUploadForm方法地方,如下所示:

ajaxFileUpload:function(s){
  // TODO introduce global settings,allowing the client to modify them for all requests,not only timeout        
  s=jQuery.extend({},jQuery.ajaxSettings,s);
  varid=newDate().getTime();
    
  // 修改为调用添加参数的方法
  // var form = jQuery.createUploadForm(id,s.fileElementId);
  varform=jQuery.createUploadForm(id,s.fileElementId,s.data);
    
  vario=jQuery.createUploadIframe(id,s.secureuri);
  ...

2:运行时报:jQuery.handleError is not a function 错误;
这个错误是由于ajaxfileupload.js 是在jquery1.4.2版本之前写的,Jquery之后的版本已经没有了handleError 方法,所以可以将1.4.2版本中的该方法复制到该js中。

// handleError 方法在jquery1.4.2之后移除了,此处重写改方法
handleError:function(s,xhr,status,e){
    // If a local callback was specified,fire it
    if(s.error){
        s.error.call(s.context||s,e);
    }
    // Fire the global callback
    if(s.global){
        (s.context?jQuery(s.context):jQuery.event).trigger("ajaxError",[xhr,s,e]);
    }
},51); line-height:31.9998px"> 3:执行成功后,始终指向error方法处理,无法执行sucess方法;
这个是由于ajaxfileupload.js 处理返回data的时候,没有考虑后台返回的是字符串的问题(即使返回的JSON格式数据,我们也大多喜欢转化为字符串来返回)。修改uploadHttpData方法:

// Get the JavaScript object,if JSON is used.
if(type=="json"){
    // 如果返回的是字符串(JSON格式字符串),下面会报错,导致无法走入sucess方法 加上" 
data = r.responseText;  
var start = data.indexOf(">");  
if(start != -1) {  
var end = data.indexOf("<",start + 1);  
    if(end != -1) {  
        data = data.substring(start + 1,end);  
    }  
}  
     eval( "data = " + data );
}

修复版ajaxfileupload.js,因无法上传JS文件,有需要可以留下邮箱地址。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读