IE6 AJAX BUG [object error]

不知道多少人碰见过这个情况,当你使用jQuery 的ajax 方法调取JSON 或JSONP 对象时,在本地调试一切正常(包括IE6),但上传到服务器时IE6 就无法执行了。

假设代码是这样的:

1
2
<div id="c"></div>
<a href='javascript:' id="btn">test</a>
1
2
3
4
5
6
7
8
$("#btn").on("click",function(){
	$.ajax({
		url:"1.json",
		dataType:"JSON" //JSON 或 JSONP
	}).done(function(data){
		$("#c").html(data.content);
	})
})

本地调试时包括IE6 在内各大主流浏览器都执行正常,上传到服务器再访问时,ie6 失败了。

以前一直使用的 <a href=”javascript:void(0)”>,自从看了《疑问:为什么要使用href=”javascript:void(0);”?》这篇文章后我也开始使用 <a href=”javascript:”>,所以我尝试修改回去,结果还是不行。

然后我想看看错误信息,改了下代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
$("#btn").on("click",function(){
	$.ajax({
		url:"1.json",
		dataType:"JSON" //JSON 或 JSONP
	}).done(function(data){
		$("#c").html(data.content);
	}).fail(function(a,b,c){
		alert(a.readyState);	//输出:4
		alert(a.responseText);	//输出:undefined
		alert(a.status);	//输出:200
		alert(a.statusText);	//输出:success
		alert(b);	//输出:parseeror
		alert(c);	//输出:[object error]
	})
})

看情况是数据获取正常,但转换为JSON 对象时出错,所以我去查看服务器返回数据是否格式错误,假如你也认为是这样的话,很抱歉,没有错误。

这是IE6 特有的BUG,当使用A标签时才会发生,还有一种状况是当你试图点击一个A标签以修改图片的src 属性时,IE6 下也会停止执行。

原理及解决办法:《ie6下使用JS替换IMG标签里的SRC属性图片不显示的原因,ie6存在的bug

有几个吃饱了没事儿干的老外反复试验发现这个问题是ie6中一个底层机制的bug,之后的版本已经解决了。据说:<a href=”javascript:void(0)”> 或者 <a href=#”> 这样使用a标签的话并不能阻止a标签最后触发一个什么行为,导致ie6会错误的认为页面刷新或者重定向了,并且中断了当前所有连接,

返回刚才的话题,ajax也是一种数据传输,这么理解的话只要使用A标签触发传输数据的事件,在IE6 下都会失败,知道问题就好解决了,办法有3种:

1.最简单的,换个标签吧,别用A了。

2.使用 <a href=”javascript:aa();”> 这种写法调用javascript方法。

3.在绑定事件里阻止A标签触发默认事件,jQuery就提供了个很简单的调用 event.preventDefault()。

修改下js:

1
2
3
4
5
6
7
8
9
$("#btn").on("click",function(e){
	e.preventDefault();
	$.ajax({
		url:"1.json",
		dataType:"JSON" //JSON 或 JSONP
	}).done(function(data){
		$("#c").html(data.content);
	})
})

测试正常,传到服务器上再测试,IE6正常,搞定 :b4

2 条评论在 “IE6 AJAX BUG [object error]

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据