ajaxfileupload使用中的一些问题

项目以前是按照微信开发的,前端input上传图片功能用的是微信JS,在手机浏览器中无法正常上传图片,所以准备改用ajaxfileupload。在网上查找资料,大部分的ajaxfileupload原文件都不一样,质量参差不齐,有各种各样的错误,向大家推荐一个修改过没有错误的版本,供大家下载ajaxfileupload.js
以下是我在使用过程遇到的一些问题,供大家参考:

一、后台接收不到数据:

  1. input标签中没有name属性
  2. 只能传递图片数据,不能传递data,这是原文件中ajaxFileUpload方法中没有data,换成上面的版本就可以了
  3. 如果type是json格式,data中向后台传递数据也要是json格式

二、不管返回正确或者错误,一直进入error回调函数

  1. 如果type是json格式,后台返回数据也要是json格式,保持一致
  2. 在ajaxfileupload原文件中找到uploadHttpData方法,在json方式中按照以下修改
    if ( type == "json" )
    {
    //处理会加pre标签
    if(data.indexOf('<pre>') != -1) {
    data = data.substring(5, data.length-6);
    }
    //处理会加audio标签
    if(data.indexOf('<audio') != -1) {
    data = data.substring(0, data.indexOf('<audio'));
    }
    //改变原来的转换json逻辑
    data = jQuery.parseJSON(data);
    }

三、input标签只能选择一次

  1. 在createUploadForm方法中,按照以下修改
    var oldElement = $('#' + fileElementId);
    var newElement = $(oldElement).clone(true);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ajaxfileupload.js可以兼容IE8以下版本实现无刷新的Form提交,上传文件。 这个版本修改了提交后台失败的几个bug 使用是需注意以下几点: 1.调用createUploadForm,此方法增加了change参数,此参数用户给新生成的input-file元素绑定change事件,如果不需要可以不加此参数。 2.要上传的input-file元素,建议放id和name属性,而且这两个属性值要保持一致 3.后台代码,response里的contenttype要设置为"text/html",前台的success回调对返回值作处理 例子如下: js: $.ajaxFileUpload({ url: url, type: 'post', data: data, secureuri: false, fileElementId: fileId, // input-file的id、name属性名 dataType: 'JSON', beforeSend: function (XMLHttpRequest) { //show loading... }, success: function (data, status) { data = jQuery.parseJSON(data); success(data); }, error: function (data, status, e) { error(e); }, complete: function (XMLHttpRequest, textStatus) { //hide loading... }, change: change //需要绑定到动态生成的input-file元素上的change事件处理方法;没有的话,这个参数可以不写 }); 如果加了change,change方法需要处理一下,因为发现会被调2次 function Upload(event) { var fileid = $(event.target).attr('id'); if(isNullOrEmpty(fileid) || /^jUploadFile\d+$/.test(fileid))return; //注意:此处过滤无效调用 //... } 后台代码(ashx): public void ProcessRequest(HttpContext context) { try { context.Response.ContentType = "text/html"; var request = context.Request; var param1 = request.Params["param1"]; //取参数 //取上传文件 if (request.Files == null || request.Files.Count <= 0) throw new ApplicationException("no file to be uploaded!"); var file = request.Files[0]; var filename = System.IO.Path.GetFileName(file.FileName); var serverpath = Path.Combine(context.Server.MapPath(ROOT), filename); file.SaveAs(serverpath); //自定义返回Json字符串 var json = '{' + string.Format(json, id, finfo.Name, extension, path) + '}'; response.Write(json); return; }

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值