最近在做前台效果的时候用到了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. Atitit 找人软福利建设 技术团队建设大概流程

    Atitit 找人软福利建设 技术团队建设大概流程 火车公司有免费车座,餐馆有免费饭吃.. 软件公司嘛,就是软件资源,知识了...技术... 培训体系 大概的知识库体系..让他知道来到我们团队有着很高 ...

  2. ES6模块的import和export用法

    ES6之前已经出现了js模块加载的方案,最主要的是CommonJS和AMD规范.commonjs主要应用于服务器,实现同步加载,如nodejs.AMD规范应用于浏览器,如requirejs,为异步加载 ...

  3. C# DateTime的 ParseExact和 TryParseExact 使用说明

    最近需要把“20121010”转换为“2012-10-10”格式,直接用Convert.ToDateTime("20121010"),系统报错“未被识别的DateTime类型”. ...

  4. HTML5学习笔记(二十五):事件

    在浏览器或文档某个元素发生某个特定情况的瞬间,会作为一个事件进行广播,我们可以对其添加监听来处理特定的事件. 事件流 事件流描述了页面中接收事件的顺序. 整个事件流包含了三个阶段:事件捕获阶段.事件目 ...

  5. RightScale 2019年云状态报告:公共云快速增长 微软Azure增长最快

    https://www.rightscale.com/ 全球云管理服务厂商RightScale发布了年度云状态报告,今年报告的十大主要内容包括:企业在多云平台上投入巨资.公共云继续快速增长,但是私有云 ...

  6. 解决jar格式文件,双击不能直接运行问题

    前提:  安装了JDK 步骤: 1.先右击jar文件,打开方式->选择默认程序->浏览,选中jre下bin文件中javaw.exe(比如我的javaw.exe在C:\Program Fil ...

  7. (转)C++头文件顺序

    转自:http://blog.csdn.net/clever101/article/details/7269058关键总结:先包含的头文件的函数会覆盖后包含的头文件的同名函数.建议采用Google C ...

  8. WebService中方法的重载

    阅读目录 一:WebService中的方法是否允许重载? 二:为什么WebService中不支持方法的重载? 三:如何解决WebService中方法的重载? 一:WebService中的方法是否允许重 ...

  9. 一个实体对象不能由多个 IEntityChangeTracker 实例引用。

    错误代码 public bool addSubOptionItem(csModel.cs_Answer answers) { bool result = false; wpe = new csWeiP ...

  10. Servlet实例开发---学生管理系统

    Servlet总结 本程序采用Servlet开发技术,MVC分层,所有程序在设计时都要接口为操作的标准,主要逻辑操作只有增删改查. 具体实现操作请看源代码. 本程序采用的是MYSQL数据库,需加入相应 ...