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 ...
随机推荐
- Python内置类型(1)——真值测试
python中任何对象都能直接进行真假值的测试,用于if或者while语句的条件判断,也可以做为布尔逻辑运算符的操作数 python中任何对象都能直接进行真假值的测试,而不需要额外的类型转换 这一点是 ...
- Redis使用sortedset缓存IP段数据
我们原来的业务中,有很多地方需要解析用户IP的信息,刚开始是通过新浪.百度这些第三方的接口来解析IP信息,后来发现调用这些接口频繁时会被禁用一小段时间.不得已只得将数据存到我们的数据库中,表结构大致如 ...
- 201. Orchard学习 一、基础
一.项目介绍 Orchard是一个免费和开源的社区交流项目,致力于在ASP.NET平台开发应用程序和可重用性组件.它将创建用于ASP.Net应用和扩展的共享组件,以及修改这些组件以便使其应用于终端用户 ...
- Android_TextView使用Spanable
TextView通常用来显示普通文本,但是有时候需要对其中某些文本进行样式.事件方面的设置.Android系统通过SpannableString类来对指定文本进行相关处理,具体有以下功能: 1.Bac ...
- salesforce lightning零基础学习(六)Lightning Data Service(LDS)
本篇可参看:https://trailhead.salesforce.com/modules/lightning_data_service Lightning中针对object的detail页面,一个 ...
- TCP/IP 笔记 - 传输控制协议
与UDP不同,TCP提供面向连接的.可靠的.基于字节流的传输层协议,且提供差错纠正. TCP传输的概念 对与分组丢失和比特差错的处理方法,最直接的方法是重发分组,直到它被正确接收. 这需要一种方法来判 ...
- Hashtable,HashMap,TreeMap有什么区别?Vector,ArrayList,LinkedList有什么区别?int和Integer有什么区别?
接着上篇继续更新. /*请尊重作者劳动成果,转载请标明原文链接:*/ /*https://www.cnblogs.com/jpcflyer/p/10759447.html* / 题目一:Hashtab ...
- 高可用Hadoop平台-Oozie工作流之Hadoop调度
1.概述 在<高可用Hadoop平台-Oozie工作流>一篇中,给大家分享了如何去单一的集成Oozie这样一个插件.今天为大家介绍如何去使用Oozie创建相关工作流运行与Hadoop上,已 ...
- EOS多节点组网:商业场景分析以及节点启动时序
区块链公链都是基于p2p网络,本篇文章将建立一个多节点不同职责参与的EOS的测试网络,根据路上发现的可做文章的技术点大做文章. 关键字:EOS组网,全节点,交易确认,boot sequence,sta ...
- 自动化发布-GitLab WEB Hooks 配置
钩子(hooks) hooks是在特定事件发生之前或之后执行特定脚本代码功能(从概念上类比,就与监听事件.触发器之类的东西类似). Git hooks就是那些在Git执行特定事件(如commit.pu ...