问题:

页面自适应的时候需要用到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. golang源码阅读:VictoriaMetrics中的协程优先级的处理方式

    在阅读VictoriaMetrics的源码的时候,读到了那么平平无奇的一段: // AddRows adds the given mrs to s. func (s *Storage) AddRows ...

  2. 007 Linux 命令三剑客之-awk

    01 一起来认识 awk! Linux 命令三剑客,sed.grep.awk. sed:擅长数据修改. grep:擅长数据查找定位. awk:擅长数据切片,数据格式化,功能最复杂. awk 更适合格式 ...

  3. Java安全之C3P0链利用与分析

    Java安全之C3P0链利用与分析 0x00 前言 在一些比较极端情况下,C3P0链的使用还是挺频繁的. 0x01 利用方式 利用方式 在C3P0中有三种利用方式 http base JNDI HEX ...

  4. Java 继承02

    向上类型转换 父类型的引用指向子类型的实例. Person p = new Person();Animal a = p; //子类对象赋值给父类类型的变量 注意: 向上转型后,子类单独定义的方法会丢失 ...

  5. Linux命令date日期时间和Unix时间戳互转

    A.将日期转换为Unix时间戳将当前时间以Unix时间戳表示: date +%s 输出如下: 1361542433 转换指定日期为Unix时间戳: date -d '2013-2-22 22:14' ...

  6. 如何从0到1设计一个类Dubbo的RPC框架

    之前分享了如何从0到1设计一个MQ消息队列,今天谈谈"如何从0到1设计一个Dubbo的RPC框架",重点考验: 你对RPC框架的底层原理掌握程度. 以及考验你的整体RPC框架系统设 ...

  7. 《PHP面试笔试真题库》——PHP面试的好帮手

    你好,是我琉忆. 一个文艺的PHP开发工程师. 很荣幸能够在这里带来我的第一本新书--<PHP程序员面试笔试真题库>. 一.创作过程 <PHP 程序员面试笔试真题库>是我的第三 ...

  8. 《PHP程序员面试笔试宝典》——如何应对自己不会回答的问题?

    如何巧妙地回答面试官的问题? 本文摘自<PHP程序员面试笔试宝典> 在面试的过程中,对面试官提出的问题求职者并不是都能回答出来,计算机技术博大精深,很少有人能对计算机技术的各个分支学科了如 ...

  9. Solution -「LOCAL」「cov. HDU 6816」折纸游戏

    \(\mathcal{Description}\)   Link(削弱版).   \(n\) 张纸叠在一起对折 \(k\) 次,然后从上到下为每层的正反两面写上数字,求把纸重新摊平后每张纸上的数字序列 ...

  10. c++ 移动与拷贝

    c++ 移动与拷贝