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()需 ...
随机推荐
- uva 1339
Ancient Roman empire had a strong government system with various departments, including a secret ser ...
- BZOJ3425 : Poi2013 Polarization
最小值肯定是把树看作二分图,此时答案为$n-1$. 最大值一定是选取重心为根,任意一个子树要么全部指向根,要么全部背离根,这样可以制造最大的星型图. 统计出每个子树的大小后做01背包,如果小于$\sq ...
- [R]R语言里的异常处理与错误控制
之前一直只是在写小程序脚本工具,几乎不会对异常和错误进行控制和处理. 随着脚本结构和逻辑更复杂,脚本输出结果的准确性验证困难,同时已发布脚本的维护也变得困难.所以也开始考虑引入异常处理和测试工具的事情 ...
- odeforces Beta Round #77 (Div. 2 Only)
A. Football time limit per test 2 seconds memory limit per test 256 megabytes input standard input o ...
- wamp环境下安装memcached最好的详解教程^.^:(只需要3个步骤 )
win8.1 wampserver2.5 -Apache-2.4.9-Mysql-5.6.17-php5.5.12-64b 可以参考一下部分讲解有图,我就是看4-5个讲解,结合有一篇的截图最终才搞定的 ...
- linux 中修改root的密码
修改root密码 有的时候会出现忘记了root 用户密码的情况,再次我们可以通过进入single(单)用户模式,将root的密码重新设置,然后重启登录即可. 具体流程: 1.先登录root用户(密码已 ...
- 最完美解决方案:js弹出窗口关闭当前页面,而不弹出提示框
该功能主要用于业务系统中的登录操作,登录后弹出全屏的业务系统主界面,而不需要工具栏.地址栏.菜单等功能. 之前针对不同浏览器找了无数种方法,包括网上能查到的所有方法,弹出的结果都不理想.结果有的IE6 ...
- Oracle临时表GLOBAL TEMPORARY TABLE
临时表:像普通表一样,有结构,但是对数据的管理上不一样,临时表存储事务或会话的中间结果集,临时表中保存的数据只对当前 会话可见,所有会话都看不到其他会话的数据,即使其他会话提交了,也看不到.临时表不存 ...
- css圆角边框
一.CSS3圆角的优点 传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,而且还有其他多个优点: * 减少维护的工作量.图片文件的生成.更新. ...
- 【android studio】解决android studio drawable新建项目时只有一个drawable目录的问题
概述 android studio默认新建Module时,只新建一个drawable目录,并不会新建适配不同分辨率的drawable目录.但其实,这是可以设置的.有以下两种方法: 方法1 详细步骤 进 ...