Ajaxupload.js上传插件使用
注意一下火狐,360IE78下的坑:
返回过来的response在不同浏览器下的字符串不一致
// response(chrome):<pre style="word-wrap: break-word; white-space: pre-wrap;">{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204102733907401WRME4.png"}</pre>
// response(360IE78):<PRE>{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204101939484PTND5ELI.png"}</PRE>
// response(Firefox):"<pre>{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204102931978J0GLUULI.png"}</pre>"
单纯的正则匹配并移除多余部分已经不能满足不同浏览器下的需求了
于是我们只能通过”{” ,”}”匹配截取”{”前面与”}”后面的
最后把剩余部分的json格式字符串再通过eval转为json
var UploadImg = function ($_selector, applyType, type) {
var button = $($_selector), interval;
new AjaxUpload(button, {
action: 'Handler/Users/BenefitsFund.ashx?action=ImgSave&applyType=' + applyType + '&type='+type,
name: 'myfile',
// dataType: "json",
onSubmit: function (file, ext) {
if (!(ext && /^(jpg|jpeg|png|gif|JPG|JPEG|PNG|GIF)$/.test(ext))) {
alert("图片格式不正确,请重新选择!");
return false;
}
},
onComplete: function (file, response) {//当上传完成时的操作
console.log(response);
// response(chrome):<pre style="word-wrap: break-word; white-space: pre-wrap;">{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204102733907401WRME4.png"}</pre>
// response(360IE78):<PRE>{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204101939484PTND5ELI.png"}</PRE>
// response(Firefox):"<pre>{"success":true,"info":"保存成功!","PhotoURL":"\/upload_BenefitsFund\/33\/20151204102931978J0GLUULI.png"}</pre>"
response = response.substring(response.lastIndexOf("{"));///去response中"{"前面的除字符串
// console.log(response);
response = response.substring(0, response.lastIndexOf("}") + 1);///去response中"}"后面的除字符串
//alert(response);
// console.log(response);
//var reg = /<pre.+?>(.+)<\/pre>/g;
//var result = response.match(reg);
//response = RegExp.$1;//去除多余的字符串
// alert(response)
//response = JSON.parse(response);//转成json格式 IE78不支持
// response = $.parseJSON(response);//转成json格式
response = eval("(" + response + ")");//转成json格式 IE78支持
// response = JSON.parse(response);
//alert(response)
// console.log(response);
//var _MyJson = '{ "success": true, "info": "保存成功!", "PhotoURL": "/upload_BenefitsFund/33/201512031628303370LTKBULS.png" }';
//alert(_MyJson);
//console.log("1" + _MyJson);
//_MyJson = eval("(" + _MyJson + ")");
// alert(response.success)
if (response.success == true) {
alert("上传成功");
button.find(".upload_img").attr("src", response.PhotoURL)
}
else {
alert(response.reason);
}
//if (file!= "") {
// //window.location.href = window.location.href;
// alert("dd");
// //alert(response)
// console.log(response)
//}
},
onError: function (id, fName, error) {
ZENG.msgbox.show("上传失败,请重试!", 1, 2000);
window.clearInterval(interval);
}
});
}
new UploadImg(".Js_upload_sfz01",4,0);//上传身份证正面
Ajaxupload.js上传插件使用的更多相关文章
- js上传插件uploadify自动检测不到flash控件的问题
[问题描述] 项目开发中,由于使用了js的一个上传插件uploadify,下载的是flash版本的,后来在谷歌浏览器上运行时经常报flash控件未安装,虽然下图是uploadify自动检测自动弹出来的 ...
- angular js 上传插件 ng-file-upload 使用时注意事项
项目框架为angular js,需要用到文件上传,百度之后先选择了angular-file-upload,githuab上API文档很全,想要具体了解,可以仔细研究一下.在这里简单回顾一下自己使用的插 ...
- 【原】ajaxupload.js上传报错处理方法
相信大家在工作中经常用到文件上传的操作,因为我是搞前端的,所以这里主要是介绍ajax在前端中的操作.代码我省略的比较多,直接拿js那里的 $.ajaxFileUpload({ url:'www.cod ...
- 7款js文件上传插件
1. jQuery File Upload 具有多文件上传.拖拽.进度条和图像预览功能的文件上传插件,支持跨域.分块.暂停恢复和客户端图像缩放.可与任何服务端平台(如PHP.Python.Ruby ...
- 纯原生js移动端图片压缩上传插件
前段时间,同事又来咨询一个问题了,说手机端动不动拍照就好几M高清大图,上传服务器太慢,问问我有没有可以压缩图片并上传的js插件,当然手头上没有,别慌,我去网上搜一搜. 结果呢,呵呵...诶~又全是基于 ...
- js插件---IUpload文件上传插件(包括图片)
js插件---IUpload文件上传插件(包括图片) 一.总结 一句话总结:上传插件找到真正上传位置的代码,这样就可以知道整个上传插件的逻辑了, 找资料还是github+官方 1.如何在js中找到真正 ...
- PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件
PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...
- Js 之移动端图片上传插件mbUploadify
一.下载 https://pan.baidu.com/s/1NEL4tkHoK4ydqdMi_hgWcw 提取码:vx7e 二.Demo示例 <div class="weui_uplo ...
- JQuery文件上传插件JQuery.upload.js的用法简介
JQuery文件上传插件,这个插件很小,用法很简单,效果却很棒.注意:JQuery版本要求1.8及以上,大家执行如果没效果,则检查JQuery版本,如果是1.8及以上,则该插件源码中的.size()需 ...
随机推荐
- 每天一个linux命令--退出<符号
linux出现如下情况: [calendar@test190 logs]$ [calendar@test190 logs]$ [calendar@test190 logs]$ [calendar@te ...
- jquery上传文件控件Uploadify
基于jquery的文件上传控件,支持ajax无刷新上传,多个文件同时上传,上传进行进度显示,删除已上传文件. 要求使用jquery1.4或以上版本,flash player 9.0.24以上. 有两个 ...
- ural 1070. Local Time
1070. Local Time Time limit: 1.0 secondMemory limit: 64 MB Soon the USU team will go to Vancouver to ...
- aspx与ashx
ashx在VS的中文版是新建“一般处理程序”,其实是一个实现类System.Web.IHttpHandler接口的类.而任何一个实现了IHttpHandler接口的类都能作为一个外部请求的目标程序.H ...
- BZOJ 1831 & 就是一个DP....
题意: 比如说,4 2 1 3 3里面包含了5个逆序对:(4, 2), (4, 1), (4, 3), (4, 3), (2, 1). 可惜的是,由于年代久远,这些数字里有一部分已经模糊不清了,为了方 ...
- HDU 1754区间最值 & SPLAY
真是亲切的1754啊..第一道傻逼版的线段树做的是这个,后来学了zkw做的是这个,在后来决定打lrj线段树又打了一遍,如今再用splay和老朋友见面 从上到下依次为:加了读入优化的splay,sp ...
- [知识点]Cantor展开
// 此博文为迁移而来,写于2015年3月14日,不代表本人现在的观点与看法.原始地址:http://blog.sina.com.cn/s/blog_6022c4720102vtyo.html 1.含 ...
- CF 9D. How many trees?(dp)
题目链接 以前做过类似的,USACO,2.3,开始数组开小了,导致数据乱了,然后超数据范围了,.. #include <cstdio> #include <iostream> ...
- Android -- TextView (3)
1.效果图
- 对AFN的二次封装
.h .m