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);

转载于:https://www.cnblogs.com/JosephBee/p/9699788.html