最近在做前台效果的时候用到了JQuery提供的resize()事件。resize 
这个事件是监听浏览器窗口的放大与缩小,也就是说浏览器窗口大小的变化。

我在W3CSCHOOL上面查阅的时候,提供了一个例子。W3C源码


  1. <</SPAN>html>
  2. <</SPAN>head>
  3. <</SPAN>script type="text/javascript" src="/jquery/jquery.js"></</SPAN>script>
  4. <</SPAN>script type="text/javascript">
  5. x=0;
  6. $(document).ready(function(){
  7. $(window).resize(function() {
  8. $("span").text(x+=1);
  9. });
  10. $("button").click(function(){
  11. $(window).resize();
  12. });
  13. });
  14. </</SPAN>script>
  15. </</SPAN>head>
  16. <</SPAN>body>
  17. <</SPAN>p>窗口的大小被调整了 <</SPAN>span>0</</SPAN>span> 次。</</SPAN>p>
  18. <</SPAN>p>请试着调整浏览器窗口的大小。</</SPAN>p>
  19. <</SPAN>button>触发窗口的 resize 事件</</SPAN>button>
  20. </</SPAN>body>
  21. </</SPAN>html>
 结果我在IE环境下放大窗口 resize 事件执行了两次。后来我在谷歌和百度上面查询了下, 都存在IE环境下执行两次的相关信息。最后发现一个很不错的解决方案。 国外有个哥子写了个插件专门针对Jquery.resize()事件增强了。 地址在这里:http://benalman.com/projects/jquery-resize-plugin/ 在添加jquery.js之后在添加 "jquery.ba-resize.js" 就可以了。  
 
    1. <</SPAN>html>
    2. <</SPAN>title>JQuery - resize()</</SPAN>title>
    3. <</SPAN>head>
    4. <</SPAN>script type="text/javascript" src="js/jquery.js"></</SPAN>script>
    5. <</SPAN>script type="text/javascript" src="js/jquery.ba-resize.js"></</SPAN>script>
    6. <</SPAN>script type="text/javascript">
    7. x=0;
    8. $(document).ready(function(){
    9. $(window).resize(function() {
    10. $("span").text(x+=1);
    11. });
    12. });
    13. </</SPAN>script>
    14. </</SPAN>head>
    15. <</SPAN>body>
    16. <</SPAN>p>窗口大小被调整过 <</SPAN>span>0</</SPAN>span> 次。</</SPAN>p>
    17. <</SPAN>p>请试着重新调整浏览器窗口的大小。</</SPAN>p>
    18. </</SPAN>body>
    19. </</SPAN>html>

解决在IE浏览器中JQuery.resize()执行多次的方法(转)的更多相关文章

  1. JavaScript在浏览器中把文本保存为文件的方法

    JavaScript在浏览器中把文本保存为文件的方法 经过测试第二种方法可以保存更多的文本不至于卡死 var saveTextAsFile1 = function (text, fileName, s ...

  2. 解决安卓微信浏览器中location.reload 或者 location.href失效的问题

    在移动wap中,经常会使用window.location.href去跳转页面,这个方法在绝大多数浏览器中都不会 存在问题,但早上测试的同学会提出了一个bug:在安卓手机的微信自带浏览器中,这个是失效的 ...

  3. 解决H5微信浏览器中audio兼容-- 背景音乐无法自动播放

    我们知道,ios 在safari浏览器中,audio标签不能在没有用户交互的情况下自动播放或有js直接控制播放,这是系统限制的一些原因. 但是背景音乐在微信浏览器可以设置自动播放,config配置一下 ...

  4. javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题

    我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览 ...

  5. jQuery.Ajax()执行WCF Service的方法

    Insus.NET有在上一篇<ASP.NET MVC呼叫WCF Service的方法>http://www.cnblogs.com/insus/p/3720547.html 直接呼叫WCF ...

  6. 同一浏览器中同一JavaWeb程序不共享session方法

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/b2084005/article/details/302227351.要求 在使用struts1开发J ...

  7. .Net中jQuery.ajax()调用asp.net后台方法 总结

    利用JQuery的$.ajax()调用.Net后台方法有多种方式, 不多说了  直接上代码 前台代码 <script type="text/javascript"> $ ...

  8. 解决在IE11浏览器下,JQuery的AJAX方法不响应问题

    在项目的时候一直都是在使用谷歌浏览器在调试,后来在现场部署到服务器上的时候,客户使用的是IE浏览器,版本是11 在测试的过程中,出现几个问题,虽然是几个问题,但是问题的原因就是AJAX第一次响应,第二 ...

  9. 第十一章:WEB浏览器中的javascript

    客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节 ...

随机推荐

  1. android辅助开发工具包介绍

    辅助开发工具包(ADK)是为硬件制造商和业余爱好者准备的参考实现.硬件制造商和业余爱好者可以使用此工具包作为开发Android辅助设备的起点.每一个ADK发行版都将提供源代码和硬件规格,以使整个辅助设 ...

  2. 利用阿里云如何开发一款直播app?

    在开发的过程中应该注意些什么?下面让小编告诉你: 随着互联网的发展,越来越多的人已经加入互联网的行列.而且很多的人也开始直播,和众多的网友分享自己身边事情.互联网还在加速发展,从PC互联网,到移动互联 ...

  3. macbook安装homebrew并更换清华源

    1.官网brew.sh复制安装脚本. 2.自动安装完成后,更换为清华源来加快速度.网址为:https://mirrors.tuna.tsinghua.edu.cn/help/homebrew 3.更换 ...

  4. 使用android-resource-remover优化资源使用率和lint-result.xml如果导出

    安装教程:http://blog.csdn.net/mlj1668956679/article/details/38643145   按照上面教程中.下载了 get-pip.py.后一运行出现这个问题 ...

  5. WCF返回null超时

    Message.CreateMessage(msg.Version, msg.Headers.Action + "Response", DealObject("错误信息& ...

  6. html5中audio的详细使用

    html5的audio功能上已经非常强大,回放,跳转,缓冲等以前只能用flash才能实现的功能,html5的audio都能轻松搞定 最近的一个项目使用到了这个功能,把我使用的情况写下来,供大家参考, ...

  7. 采用Oracle的dbms_obfuscation_toolkit的加密

    create or replace function MD5 (vpassword in varchar2) return varchar2 is retval varchar2(32); begin ...

  8. 李洪强和你一起学习前端之(9)规避脱标,CSS可见性,滑动门案例

    1  复习昨天知识 1.1 浮动  特点: >浮动的元素不占位置(脱标) >可以将行内元素转化为行内块元素 >块级元素在一行上显示 >设置了浮动的元素,影响其后面的元素   作 ...

  9. Android Http 下载

    在安卓中,可以直接用java的java.net.URL包访问网络下载数据.不同的是,安卓程序需要权限,需要在AndroidManifest.xml文件中声明权限 <!-- 网络权限 --> ...

  10. ubuntu+nginx+laravel

    1, 到http://v4.golaravel.com/docs/4.2/installation 点击下载最新版Laravel框架.然后解压 2,把laravel-master下的文件夹拷入到php ...