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()需 ...
随机推荐
- Android 开源项目
StickerCamera 一个完整的开源项目.贴纸标签相机(类似nice,in),拍照,裁剪,贴贴纸打标签功能. MD-BiliBili 基于 Material Design 的 BiliBili ...
- android 自定义 view 和 ViewGroup
---恢复内容开始--- ViewGroup的职能为:给childView计算出建议的宽和高和测量模式 :决定childView的位置:为什么只是建议的宽和高,而不是直接确定呢,别忘了childVie ...
- Sphinx 全量索引加实时索引
source mysql { type = mysql sql_host = 10.10.3.181 sql_user = root sql_pass = dsideal sql_db = dside ...
- 洛谷 P1012 拼数 Label:续命模拟QAQ
题目描述 设有n个正整数(n≤20),将它们联接成一排,组成一个最大的多位整数. 例如:n=3时,3个整数13,312,343联接成的最大整数为:34331213 又如:n=4时,4个整数7,13,4 ...
- box-sizing的相关属性
box-sizing有三个属性,分别是:content-box,border-box,inherit (1)content-box:在宽度和高度之外绘制元素的内边距和边框(默认属性) (2)borde ...
- [BZOJ2788][Poi2012]Festival
2788: [Poi2012]Festival Time Limit: 30 Sec Memory Limit: 64 MBSubmit: 187 Solved: 91[Submit][Statu ...
- HDU 4002 Find the maximum(欧拉函数)
题目链接 猜了一个结论,题面跟欧拉函数有关系. import java.util.*; import java.math.*; import java.text.*; import java.io.* ...
- 配置安装CocoPods后进行 项目基本配置
配置安装CocoPods后进行 项目基本配置总结 1)终端在文件根目录下输入 $ touch Podfile 创建一个空白的Podfile文件 2)然后在使用编辑器打开Podfile文件进行需要配置的 ...
- CentOS VirtualBox启动虚拟及报错:VirtualBox error: Kernel driver not installed (rc=1908)
VirtualBox error: Kernel driver not installed (rc=1908) Hi all, Let me first say that this is my fin ...
- 使用Privoxy做智能代理切换
使用Privoxy做智能代理切换 You take the blue pill, the story ends, you wake up in your bed, and believe whatev ...