解决jQuery ajax请求在IE6中莫名中断的问题


Posted in Javascript onJune 20, 2016

场景还原:给a标签绑定了一个click事件用来触发ajax请求,在IE6中,请求时常会被中断,在非IE6中都一切正常。

<a href="javascript:;" id="btn">click me</a>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
 var url = "http://api.flickr.com/services/"
 "feeds/photos_public.gne?tags=car&"
 "tagmode=any&format=json&jsoncallback=?";
 $( "#btn" ).click(function(){
  $.getJSON( url, function( data ){
   alert( data );
  });
 });
</script>

在IE6中使用Fiddler2监视请求,经常会出现”aborted”,折腾了许久,相当的诡异。后来将a标签换成button,请求正常,最后经提醒,可能是a标签的默认事件中断了请求。但是,在HTML代码中,已经将a标签的href设置成了”javascript:;”,通常这样是可以阻止默认事件了(页面跳转)。a标签的click事件会先执行,然后才执行href的跳转,如果href是一段javascript语句,这个时候就会执行。IE6在执行href的javascript语句时就中断了click触发的ajax请求。使用href=”javascript:;”是为了阻止默认事件,将阻止默认事件的动作移到click事件中就可以解决问题了,这样就不会执行href中的javascript语句了。

$( "#btn" ).click(function(e){
 $.getJSON( url, function( data ){
  alert( data );
 });
 e.preventDefault();
});

注:e.preventDefault(); 这一句的作用就是阻止js中的默认事件。

以上就是本文的全部内容,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
可拖动窗口,附带鼠标控制渐变透明,开启关闭功能
Jun 26 Javascript
在IE模态窗口中自由查看HTML源码的方法
Mar 08 Javascript
js模拟滚动条(横向竖向)
Feb 22 Javascript
js 验证密码强弱的小例子
Mar 21 Javascript
Javascript中的五种数据类型详解
Dec 26 Javascript
JS继承之借用构造函数继承和组合继承
Sep 07 Javascript
JS实用的带停顿的逐行文本循环滚动效果实例
Nov 23 Javascript
实例分析浏览器中“JavaScript解析器”的工作原理
Dec 12 Javascript
微信小程序实现动态显示和隐藏某个控件功能示例
Dec 14 Javascript
jquery实现垂直无限轮播的方法分析
Jul 16 jQuery
node使用request请求的方法
Dec 20 Javascript
基于JavaScript或jQuery实现网站夜间/高亮模式
May 30 jQuery
indexedDB bootstrap angularjs之 MVC DOMO (应用示例)
Jun 20 #Javascript
JS控制层作圆周运动的方法
Jun 20 #Javascript
简单实现jQuery进度条轮播实例代码
Jun 20 #Javascript
移动端H5开发 Turn.js实现很棒的翻书效果
Jun 20 #Javascript
angularjs封装bootstrap时间插件datetimepicker
Jun 20 #Javascript
jQuery插件 Jqplot图表实例
Jun 18 #Javascript
jqPlot jQuery绘图插件的使用
Jun 18 #Javascript
You might like
第十四节--命名空间
2006/11/16 PHP
thinkPHP多语言切换设置方法详解
2016/11/11 PHP
随机显示经典句子或诗歌的javascript脚本
2007/08/04 Javascript
Prototype 学习 工具函数学习($w,$F方法)
2009/07/12 Javascript
javascript 异步页面查询实现代码(asp.net)
2010/05/26 Javascript
兼容FF和IE的动态table示例自写
2013/10/21 Javascript
JS按字节截取字符长度实例
2013/11/20 Javascript
实现网页页面跳转的几种方法(meta标签、js实现、php实现)
2014/05/20 Javascript
jQuery实现返回顶部功能适合不支持js的浏览器
2014/08/19 Javascript
js在数组中删除重复的元素自保留一个(两种实现思路)
2014/08/22 Javascript
BootStrap中Tab页签切换实例代码
2016/05/30 Javascript
VueJs单页应用实现微信网页授权及微信分享功能示例
2017/07/26 Javascript
实现jquery放大镜的两种方法
2018/02/22 jQuery
浅谈微信页面入口文件被缓存解决方案
2018/09/29 Javascript
解决vue初始化项目时,一直卡在Project description上的问题
2019/10/31 Javascript
vue+vant-UI框架实现购物车的复选框全选和反选功能
2019/11/05 Javascript
jQuery实现全选、反选和不选功能的方法详解
2019/12/04 jQuery
js实现随机圆与矩形功能
2020/10/29 Javascript
[10:21]2018DOTA2国际邀请赛寻真——Winstrike
2018/08/11 DOTA
Python实现程序的单一实例用法分析
2015/06/03 Python
Python实例一个类背后发生了什么
2016/02/09 Python
老生常谈Python序列化和反序列化
2017/06/28 Python
解决Mac下使用python的坑
2019/08/13 Python
python GUI库图形界面开发之PyQt5窗口类QMainWindow详细使用方法
2020/02/26 Python
Python的3种运行方式:命令行窗口、Python解释器、IDLE的实现
2020/10/10 Python
法国珠宝店:CLEOR
2017/01/29 全球购物
Turnbull & Asser官网:英国皇室御用的顶级定制衬衫
2019/01/31 全球购物
应届生的求职推荐信范文
2013/11/30 职场文书
营销总监岗位职责范本
2014/02/26 职场文书
班主任新年寄语
2014/04/04 职场文书
三好学生演讲稿范文
2014/04/26 职场文书
安全施工责任书
2014/08/25 职场文书
委托培训协议书
2014/11/17 职场文书
2014年幼儿园园务工作总结
2014/12/05 职场文书
教师业务学习材料
2014/12/16 职场文书
会计继续教育培训心得体会
2016/01/19 职场文书