zoukankan      html  css  js  c++  java
  • 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);

  • 相关阅读:
    python并发编程之gevent协程(四)
    python并发编程之asyncio协程(三)
    python并发编程之multiprocessing进程(二)
    python并发编程之threading线程(一)
    python设计模式之内置装饰器使用(四)
    python设计模式之装饰器详解(三)
    python设计模式之迭代器与生成器详解(五)
    EF code First数据迁移学习笔记
    15.02.13-代码小技巧
    Route学习笔记之Area的Route注册
  • 原文地址:https://www.cnblogs.com/JosephBee/p/9699788.html
Copyright © 2011-2022 走看看