作为一个程序员, 遇到兼容性问题真的很苦恼, 尤其是对我这种前端小菜鸡来说遇到了甚是凄惨. 一般来说兼容性问题出现率 Chrome <IE < Firefox (╯°Д°)╯︵┴┴ .
言归正传, 最近遇到了几次 Ajax 兼容性问题, 因此进行了归纳总结, 已备以后查看.
- function dealMessageById(messageId,dealFlag)
- {
- $.Ajax({
- url: getRootPath() + "/usercenter/message/UserMessage.do?method=DealMessageById",
- type: "post",
- async:false, // 一般都不写, 默认为 true. 具体信息看下面
- data: {
- "messageId" : messageId,
- "dealFlag" : dealFlag
- },
- dataType: 'json', //data 值类型
- contentType: "application/x-www-form-urlencoded; charset=UTF-8",
- success: function(data) {if(data.code == 200)
- {
- systemMessageInit();
- refreshMessage();
- $("#systemTable").html("系统消息 ("+data.siteInforCount+")");
- }
- else
- {
- dialog.alert('失败', '失败');
- }
- },
- error: function(XMLHttpRequest, textStatus, errorThrown) {
- alert(XMLHttpRequest.status);
- alert(XMLHttpRequest.readyState);
- alert(textStatus);
- // 以上 3 个值所对应的意义进入另一篇博文 status,readyState,textStatus 状态查看
- }
- });
- };
常见情况:
1. 如果你是火狐浏览器 (Firefox), 出现错误调用 error 方法或者 Ajax 请求了多次, 那么极有可能是异步请求的原因.
添加 async : false ,
-> async. 默认是 true, 即为异步方式,$.Ajax 执行后, 会继续执行 Ajax 后面的脚本, 直到服务器端返回数据后, 触发 $.Ajax 里的 success 方法, 这时候执行的是两个线程.
-> async 设置为 false, 则所有的请求均为同步请求, 在没有返回值之前, 同步请求将锁住浏览器, 用户其它操作必须等待请求完成才可以执行.
2. 后台返回的 dataType 类型和前台 JS 写的不一致会跳入 error
传的不是 JSON 格式的数据就不用写 dataType : 'json' ,
JSON 格式错误也会跳入 error.{"test":1} 所以要注意格式.
在不需要返回值的情况下, 扔按模板格式, 设置了 dataType:"json", 参数; 这时候, Ajax 传值正确时, 出现 200 返回成功状态下报错的特殊情况.
3.url:'http://192.168.1.100:8080/Xxx
如果你请求的数据不在本地或者不在同一服务器中, 那么就可能是跨域问题, 要用 JSONP, 即 dataType :'jsonp' , 当然这意思最基础的方法, JSONP 和 JSON 的格式还是有点小区别的: JSONP 比 JSON 多了个方法, 即 JSON= "json 格式数据",JSONP= "方法名 (json 格式数据)", 至于跨域的详细的解释和解决方法找度娘吧.
不常见的情况:
1.data 没有写
解决方法: data 为空也一定要传 "{}"; 不然返回的是 xml 格式的. 并提示 parsererror. data:"{}".
2.url 路径有中文
解决方法: 去掉中文.
3. 传的数据格式 Ajax 不支持
解决方法: 换成 JSON 或其他 Ajax 支持的数据格式.
4. 字符编码不匹配
解决方法: 统一 UTF-8.
来源: https://www.cnblogs.com/huxiuqian/p/10152166.html