javascript避免dom事件重复触发
/**
* 为指定控件添加限制性事件, 该事件在触发之后, 会被移除, 并在指定的时间间隔后, 重新绑定, 适用于避免控件事件被误操作重复触发的场景
* @param {String} domID 要添加事件的控件ID
* @param {String} eventName 要添加的事件, 例如: click, dblclick, 不可写成onclick, ondblclick
* @param {Function} callback 触发事件所要执行的函数, 对于有参数的函数, 需要包含在一个匿名函数中, 匿名函数中是对目标函数的调用, 对于无参数函数, 直接传目标函数名称即可
* @param {Number} interval 事件的时间间隔, Number类型或String类型的数字皆可
*/
function addLimitedEvent( domID, eventName, callback, interval ) {
var _dom = document.getElementById( domID );
if ( Number.isNaN( Number.parseInt( interval ) ) )
interval = 1;
else
interval = Number.parseInt( interval );
if ( _dom.addEventListener )
_dom.addEventListener( eventName, removeLimitedEvent );
else
_dom.attachEvent( 'on' + eventName, removeLimitedEvent );
function removeLimitedEvent() {
callback();
if ( _dom.removeEventListener )
_dom.removeEventListener( eventName, removeLimitedEvent );
else
_dom.detachEvent( 'on' + eventName, removeLimitedEvent );
setTimeout( function () {
addLimitedEvent( domID, eventName, callback );
}, interval * 1000 );
}
}
/*函数使用方法*/
addLimitedEvent('btn_Test','click',function(){handler('a','b')},1);
或
addLimitedEvent('btn_Test','click',handler,1);
javascript避免dom事件重复触发的更多相关文章
- JavaScript HTML DOM 事件
JavaScript HTML DOM 事件 HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应. 实例 Mouse Over Me 对事件做出反应 我们可以在事件发生时执行 ...
- 前端笔记之JavaScript(十)深入JavaScript节点&DOM&事件
一.DOM JavaScript语言核心.变量的定义.变量的类型.运算符.表达式.函数.if语句.for循环.算法等等.这些东西都属于语言核心,下次继续学习语言核心就是面向对象了.JavaScript ...
- javascript:理解DOM事件
首先,此文不讨论繁琐细节,但是考虑到读者的心灵感受,本着以积极向上的心态,在此还是会列举示例说明. 标题为理解DOM事件,那么在此拿一个简单的点击事件为例,希望大家看到这个例子后能触类旁通. DOM ...
- JavaScript基础—dom,事件
Js基础-DOM 1:dom:文档对象模型 Dom就是html页面的模型,将每个标签都作为一个对象,js通过调用dom中的属性,方法就可以对网页中的文本框,层等元素进行编程控制.Dom就是一些让jav ...
- 前端JavaScript之DOM事件操作
DOM:文档对象模型,操作网页上的元素的API.比如让盒子移动.变色.轮播图等. 1.DOM(Document Object Moduel):文档对象模型 定义了访问和操作HTML文档的标准法,把HT ...
- 【总结整理】JavaScript的DOM事件学习(慕课网)
事件:在文档或者浏览器窗口中发生的一些,特定的交互瞬间 HTML和JavaScript的交互通过事件 来实现 比如:1.滚动条向下滑动,加载图片 2.图片轮播,鼠标由2-5页调换 本章内容1.理解事件 ...
- 松软科技web教程:JavaScript HTML DOM 事件监听器
addEventListener() 方法 实例 添加当用户点击按钮时触发的事件监听器: document.getElementById("myBtn").addEventList ...
- javascript将DOM事件处理程序封装为event.js 出现的低级错误记录
将 DOM 0级事件处理程序和DOM2级事件处理程序 IE事件处理程序封装为eventUtil对象,达到跨浏览器的效果.代码如下: var eventUtil = { // 添加事件句柄 addEve ...
- JavaScript DOM事件模型
早期由于浏览器厂商对于浏览器市场的争夺,各家浏览器厂商对同一功能的JavaScript的实现都不进相同,本节内容介绍JavaScript的DOM事件模型及事件处理程序的分类. 1.DOM事件模型.DO ...
随机推荐
- Android_TextView使用Spanable
TextView通常用来显示普通文本,但是有时候需要对其中某些文本进行样式.事件方面的设置.Android系统通过SpannableString类来对指定文本进行相关处理,具体有以下功能: 1.Bac ...
- Json数据中同字段不同数据类型的解析
当解析Json数据时,如果碰到同字段不同数据类型的情况,如何处理呢?比如: [ { "code": 1, "data": 33 }, { "code& ...
- jsp页面简单的验证码实现
前段时间赶着结束毕业设计任务,现在完成了.回来补一下设计毕业设计的过程中遇到的问题和解决方案. 为了使小系统更有模有样,这里尝试在登录页面实现验证码功能.现描述一下我的解决方案. 首先看一下实现后的界 ...
- leetCode(寻找峰值)-二分查找
题目: 峰值元素是指其值大于左右相邻值的元素. 给定一个输入数组 nums,其中 nums[i] ≠ nums[i+1],找到峰值元素并返回其索引. 数组可能包含多个峰值,在这种情况下,返回任何一个峰 ...
- [Codeforces 1016F]Road Projects
Description 题库链接 给你一棵 \(n\) 个节点的树,定义 \(1\) 到 \(n\) 的代价是 \(1\) 到 \(n\) 节点间的最短路径的长度.现在给你 \(m\) 组询问,让你添 ...
- WebFrom 【文件上传】
文件上传 准备工作1.文件上传的页面2.上传文件要保存的文件夹 1.只要将文件传上来就行 //1.获取要上传的文件,并且知道要上传到服务器的路径 string s = "Uploads/aa ...
- JAVA中的集合容器操作类
目录 JAVA中的集合容器操作类 List集合 ArrayList的操作方法说明 LinkedList Stack Set Map Queue 总结 JAVA中的集合容器操作类 Java容器类库总共分 ...
- [PHP] 数据结构-线性表的顺序存储结构PHP实现
1.PHP中的数组实际上是有序映射,可以当成数组,列表,散列表,字典,集合,栈,队列,不是固定的长度2.数组定义中多个单元都使用了同一个键名,则只使用了最后一个,之前的都被覆盖了3.想要函数的一个参数 ...
- Android开发——使用自带图标
Android其实也是自带有许多常用的图标,我们直接使用即可 在源代码*.Java中可以进入如下方式引用: myMenuItem.setIcon(android.R.drawable.ic_menu_ ...
- 本地navicate for mysql怎么修改密码?
1.以前在本地设置sql库密码,就是在本地新建数据库的时候就输入,怎么也链接不上,原来是新建数据库的时候不能输入密码,需要在内部修改. 2. 打开mysql user表 3. 打开mysql user ...