解决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 相关文章推荐
Javascript 获取链接(url)参数的方法[正则与截取字符串]
Feb 09 Javascript
jquery下为Event handler传递动态参数的代码
Jan 06 Javascript
Node.js模拟浏览器文件上传示例
Mar 26 Javascript
ECMAScript6中Set/WeakSet详解
Jun 12 Javascript
JS判断元素是否在数组内的实现代码
Mar 30 Javascript
Angular中使用MathJax遇到的一些问题
Dec 15 Javascript
Node.js中读取TXT文件内容fs.readFile()用法
Oct 10 Javascript
webpack配置proxyTable时pathRewrite无效的解决方法
Dec 13 Javascript
js中int和string数据类型互相转化实例
Jan 16 Javascript
vue slot与传参实例代码讲解
Apr 28 Javascript
Vue使用lodop实现打印小结
Jul 06 Javascript
countup.js实现数字动态叠加效果
Oct 17 Javascript
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
关于手调机和数调机的选择
2021/03/02 无线电
PHP setcookie指定domain参数后,在IE下设置cookie失效的解决方法
2011/09/09 PHP
laravel中的错误与日志用法详解
2016/07/26 PHP
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
javascript引导程序
2008/10/26 Javascript
JavaScript定时器详解及实例
2013/08/01 Javascript
JavaScript获取当前网页标题(title)的方法
2015/04/03 Javascript
JavaScript实现的简单幂函数实例
2015/04/17 Javascript
javascript使用输出语句实现网页特效代码
2015/08/06 Javascript
JS、jQuery中select的用法详解
2016/04/21 Javascript
浅析Bootstrap缩略图组件与警示框组件
2016/04/29 Javascript
js替换字符串中所有指定的字符(实现代码)
2016/08/17 Javascript
js实现刷新页面后回到记录时滚动条的位置【两种方案可选】
2016/12/12 Javascript
详解IWinter 一个路由转控制器的 Nodejs 库
2017/11/15 NodeJs
微信小程序使用component自定义toast弹窗效果
2018/11/27 Javascript
详解vue项目中调用百度地图API使用方法
2019/04/25 Javascript
微信小程序云开发(数据库)详解
2019/05/17 Javascript
Vue.js路由实现选项卡简单实例
2019/07/24 Javascript
python如何生成网页验证码
2018/07/28 Python
使用PyQtGraph绘制精美的股票行情K线图的示例代码
2019/03/14 Python
python 实现创建文件夹和创建日志文件的方法
2019/07/07 Python
python2和python3应该学哪个(python3.6与python3.7的选择)
2019/10/01 Python
基于Python实现2种反转链表方法代码实例
2020/07/06 Python
python按照list中字典的某key去重的示例代码
2020/10/13 Python
韩国现代百货官网:Hmall
2018/03/21 全球购物
北京一家公司的.net开发工程师笔试题
2012/04/17 面试题
甲方资料员岗位职责
2013/12/13 职场文书
师范生自荐信模板
2014/05/28 职场文书
2015年挂职锻炼工作总结
2014/12/12 职场文书
2015年化妆品销售工作总结
2015/05/11 职场文书
2015年中秋晚会主持词
2015/07/01 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
使用Pytorch训练two-head网络的操作
2021/05/28 Python
剑指Offer之Java算法习题精讲二叉树专项训练
2022/03/21 Java/Android
Win11局域网共享权限在哪里设置? Win11高级共享的设置技巧
2022/04/05 数码科技