问题:

页面自适应的时候需要用到js的resize事件,但在执行过程中发现只要触发resize事件就会执行2次

原生js:
window.onresize = function(){
console.log("窗体发生改变1");
}
Jquery:
$(window).resize(function(){
console.log("窗体发生改变2");
})

解决办法:

通过增加定时器的方式来让代码延迟执行,并且每次都清除事件,所以不管怎么拖动改变窗体大小都只会执行一次

var resizeTimer = null;
$(window).resize(function(){
if (resizeTimer) clearTimeout(resizeTimer);
resizeTimer = setTimeout(function(){
console.log("窗体发生改变了");
} , 100);
});

解决Js中的resize事件执行两次的方法的更多相关文章

  1. JS: javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题

    javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...

  2. JS中定义对象原型的两种使用方法

    第一种: function Person() { this.username = new Array(); this.password = "123"; } Person.prot ...

  3. (转载)js(jquery)的on绑定点击事件执行两次的解决办法

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...

  4. 使用call、apply和bind解决js中烦人的this,事件绑定时的this和传参问题

    1.什么是this 在JavaScript中this可以是全局对象.当前对象或者任意对象,这完全取决于函数的调用方式,this 绑定的对象即函数执行的上下文环境(context). 为了帮助理解,让我 ...

  5. WPF TreeView 选择事件执行两次,获取TreeView的父节点的解决方法

    1.TreeView选择事件执行两次 Very often, we need to execute some code in SelectedItemChanged depending on the ...

  6. promise 的基本概念 和如何解决js中的异步编程问题 对 promis 的 then all ctch 的分析 和 await async 的理解

    * promise承诺 * 解决js中异步编程的问题 * * 异步-同步 * 阻塞-无阻塞 * * 同步和异步的区别? 异步;同步 指的是被请求者 解析:被请求者(该事情的处理者)在处理完事情的时候的 ...

  7. 关于struts2中action请求会执行两次的问题

    关于struts2中action请求会执行两次的问题     在struts2中发现,调用action中的方法,方法会被执行两次,后来发现调用的方法是get开头的,把它改为其他名称开头的后,就不会执行 ...

  8. JS中的计时器事件

    JS可以实现很多java代码不易完成的功能.这里学习一些js中的计时器事件. JavaScript 一个设定的时间间隔之后来执行代码,称之为计时事件. 主要通过两个方法来实现: 1.setInterv ...

  9. Jquery 事件执行两次

    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 阻止冒泡的方法并不止 return false 这一种,还有event.stopPropagation(),这两种方 ...

随机推荐

  1. Iptables的命令与用法

    目录 一:iptables的用法 1.iptables简介 二:Iptables链的概念 1.那四个表,有哪些作用? 2.那五条链,运行在那些地方? 3.Iptables流程图 三:iptables的 ...

  2. macOS Monterey 12.12.2 (21D49) 正式版 ISO、IPSW、PKG 下载

    本站下载的 macOS Monterey 软件包,既可以拖拽到 Applications(应用程序)下直接安装,也可以制作启动 U 盘安装,或者在虚拟机中启动安装. 2022 年 1 月 27 日,m ...

  3. python25day

    内容回顾 面向对象的回顾 类 对象 怎么用 怎么继承 pickle模块 今日内容 继承(进阶的知识点) 经典类和新式类 python3所有类都继承object类 所有继承object的类都是新式类 不 ...

  4. 蓝桥杯试题 基础练习 2n皇后问题以及n皇后问题

    在学习2n皇后之前,我们应该认识一下n皇后问题: 在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即任意2个皇后不允许处在同一排,同一列,也不允许处在与棋盘边框成45角的斜线上.你的任务是,对于 ...

  5. 微服务架构 | 10.1 使用 Sleuth 追踪服务调用链

    目录 前言 1. Sleuth 基础知识 1.1 Sleuth 原理 2. 在服务中使用 Sleuth 追踪 2.1 引入 pom.xml 依赖文件 2.2 查看日志信息 最后 前言 参考资料: &l ...

  6. 带你读AI论文:NDSS2020 UNICORN: Runtime Provenance-Based Detector

    摘要:这篇文章将详细介绍NDSS2020的<UNICORN: Runtime Provenance-Based Detector for Advanced Persistent Threats& ...

  7. WebService、Http请求、Socket请求

    WebService 定义 一种web程序访问方式,常见协议:SOAP(简单对象访问协议),其实就是Http+XML.利用对象进行数据交互. 请求方法 import lombok.extern.slf ...

  8. java命令-(学习)jstack 工具

    一.介绍 jstack是java虚拟机自带的一种堆栈跟踪工具.jstack用于打印出给定的java进程ID或core file或远程调试服务的Java堆栈信息,如果是在64位机器上,需要指定选项&qu ...

  9. Python安装pip时, 报错:zipimport.ZipImportError: can't decompress data; zlib not available

    解决办法: 1.安装依赖zlib.zlib-devel 2.重新编译安装Python 具体步骤: 1 到python安装目录下,运行./configure 2 编辑Modules/Setup文件 vi ...

  10. Web标准和骨架

    Web 标准的好处 1.让Web的发展前景更广阔 2.内容能被更广泛的设备访问 3.更容易被搜寻引擎搜索 4.降低网站流量费用 5.使网站更易于维护 6.提高页面浏览速度 Web 标准构成 Web标准 ...