window.onresize 多次触发的解决方法
用了window.onresize但是发现每次 onresize 后页面中状态总是不对,下面与大家分享下onresize 事件多次触发的解决方法。
之前做一个扩展,需要在改变窗口大小的时候保证页面显示正常,于是用了 window.onresize 但是发现每次 onresize 后页面中状态总是不对,后来查找出来原来是 onresize 事件触发了多次找成的,于是网上搜集了下解决办法,整理一下。
//
关于 onresize 事件触发次数,不同浏览器不同,safari, opera, firefox 都是一次(分别只用了一个版本测试,都是较新的);
//ie6 在 quirk 下触发 2 次,标准下 3 次;ie7,8 在 quirk 和 standard 都是两次。
console.log( 'hello world');
}
onresize 触发多少次并不重要,重要的是解决办法:在触发多次的情况下之调用一次帮定到 onresize 上的函数
//
//debounce 这个词不知道怎么翻译,兄弟我非科班出身,不敢轻易翻译,以免怡笑大方。:)
// www.jbxue.com
var debounce = function (func, threshold, execAsap) {
var timeout;
return function debounced () {
var obj = this, args = arguments;
function delayed () {
if (!execAsap)
func.apply(obj, args);
timeout = null;
};
if (timeout)
clearTimeout(timeout);
else if (execAsap)
func.apply(obj, args);
timeout = setTimeout(delayed, threshold || 100);
};
}
// 说明代码不是我写的。
// 代码说明:
debounce 接受 3 个参数,后两个可选;第一个是要 debounce 的函数, 第二个代表 debouce 的时间间隔,第三个在时间段的开始还是结束执行函数;
debounce 返回包装好的函数,该函数两次执行间隔至少是 threshold,并且小于 threshold 间隔的调用会重新开始计时( 两次调用的时间间隔);
把 clearTimeout( timeout ) 换为 timer = null; 返回函数两次执行间隔至少是 threshold,并且小于 threshold 间隔的调用会重新开始计时( 两次调用的时间间隔);
// 解决 onresize 多次调用
alert( 'hello world');
}, 100, true)
// 在自动补齐中为了减少请求服务器次数也会用到 debounce, 只有连续敲键间隔大于某个值才会发送 ajax
window.onresize 多次触发的解决方法的更多相关文章
- 关于 android 的setOnItemClickListener 和 setOnItemLongClickListener 同时触发的解决方法
关于 android 的setOnItemClickListener 和 setOnItemLongClickListener 同时触发的解决方法. 其实方法也是很简单 的主要 setOnItemLo ...
- document.onclick在ios上不触发的解决方法与touchstart点击穿透处理
document.onclick = function (e) { var e = e ? e : window.event; var tar = e.srcElement || e.target; ...
- js实现window.open不被拦截的解决方法汇总
一.问题: 今天在处理页面ajax请求过程中,想实现请求后打开新页面,就想到通过 js window.open 来实现,但是最终都被浏览器拦截了. 二.分析: 在谷歌搜索有没有解决方法,有些说可以通过 ...
- 使用Layered Window遇到的一些问题及解决方法
1. 使用Layered Window需要设置 WS_EX_LAYERED 属性 2. Layered Window不能作为Child Window 3. 它也不能包含子窗口,为什么呢,因为它收不到 ...
- nuxtjs在vue组件中使用window对象编译报错的解决方法
我们知道nuxtjs是做服务端渲染的,他有很多声明周期是运行在服务端的,以及正常的vue声明周期mounted之前均是在服务端运行的,那么服务端是没有比如window对象的location.navag ...
- WPF中button按钮同时点击多次触发click解决方法
DateTime lastClick = DateTime.Now; object obj = new object(); ; private void Button_Click(object sen ...
- C# 之 FileSystemWatcher事件多次触发的解决方法
1.问题描述 程序里需要监视某个目录下的文件变化情况: 一旦目录中出现新文件或者旧的文件被覆盖,程序需要读取文件内容并进行处理.于是使用了下面的代码: public void Initial() { ...
- node.js中模块报错【window is not defined】的解决方法
(function(window) { /* Keep source code the same */ // })(typeof window == "undefined" ? g ...
- Window下Qt Creator启动错误解决方法
很多电脑现在都是用的是双显卡,高性能的独显和性能比较差但耗电少的集显,在Window10系统下右键点击软件,在"图形处理器"里面可以选择使用什么显卡操作此软件.下面是我在运行Qt ...
随机推荐
- 【开发工具 - Git】之Git使用案例
本帖主要介绍一下Git在实际项目开发中的使用流程,包括克隆.暂存.提交.推送.拉取.分支.冲突解决等,暂时还不包括回退. 1.首先需要安装Git,下一步下一步就行,这里就不说了.值得一提的是,如果Gi ...
- Android源码是这样搞到的(图解)
Android学习到一定程度,就一定要多读代码多思考,Android源码就是很好的学习材料,本文就是把Android的源码下载下来.我们知道Android的源码是用Git这个分布式版本号控制工具管理的 ...
- C#读取Exeal文件
今天写一个读取Exeal的时候遇到一个问题就是引用了Mircosotf.Office.Interop.Exeal类库的时候没有办法读取到 纠结了好久百度了一下发现别人是这样写的using Exeal= ...
- iOS 网络编程:AFNetworking
1 简介 1.1 概念 AFNetworking网络框架并不是IOS自带的框架,而是第三方的开源框架.它是对NSURLConnection和NSURLSession API的封装,但是目前AFNetw ...
- centos 7.x编写开机启动服务
centos 7以上是用Systemd进行系统初始化的,Systemd 是 Linux 系统中最新的初始化系统(init),它主要的设计目标是克服 sysvinit 固有的缺点,提高系统的启动速度.关 ...
- sql 随机生成中文名字
,) )) -- 姓氏 ,) )) -- 名字 INSERT @fName VALUES ('赵'),('钱'),('孙'),('李'),('周'),('吴'),('郑'),('王'),('冯'),( ...
- (转)十分钟搞定CSS选择器
原文地址:http://www.cnblogs.com/dolphinX/p/3347713.html 在最近的web开发中是不是就会用到一些选择器,发现很多尤其是CSS3新增的不太熟悉,在此总结一下 ...
- 读取group by 之外的字段
序号 姓名 性别 身高 1 张三 男 185 2 李四 女 161 3 王五 女 166 4 赵六 男 178 1.获取男生女生人数 select count(性别) , 性别 from 表名 ...
- C# winCE连接SQL数据库
General network error. Check your network documentation. 错误解决方法 1. public static string Sqlstr = &q ...
- C#的语句
什么是语句?语句可以是以分号结尾的单行代码,或者是语句块中的一系列单行语句.语句块括在括号 {} 中,并且可以包含嵌套块. 1,语句的类型 (1)声明语句 声明语句主要是引入新的变量和常量.变量的声明 ...