js多次触发事件,在一定延迟内只执行一次的案例:

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
          .div{
            width:200px;
            height:200px;
            background:red;
            transition:width 2s linear 0s;
          }
        </style>
      </head>
      <body>
        <div class="div"></div>
      </body>
    </html>
    <script>
      var div=document.querySelectorAll(".div")[0];
      var num=0;
      var t=null;
      //事件累加的功能
      //js 多次触发点击事件,在一定延迟内只执行一次
      div.onclick=function(){
        if(t!=null){
          clearTimeout(t)
        }
        t=setTimeout(function(){
          num++;
          console.log(num);
        },500)
      }

    </script>

js多次触发事件,在一定延迟内只执行一次 (事件累加)的更多相关文章

  1. vue.js 添加 fastclick的支持 处理移动端click事件300毫秒延迟

    fastclick:处理移动端click事件300毫秒延迟. 1,先执行安装fastclick的命令 npm install fastclick 2,在main.js中引入,并绑定到body. imp ...

  2. JQuery触发hover事件无效时使用js原生的触发事件方法

    需求:在开发一个从微信公众号后台管理网页上爬取数据的chrome插件时,有部分页面元素是只显示了部分摘要信息的,需要把鼠标移上去后才能显示全部信息(类似title的弹出显示).这就需要在chrome插 ...

  3. fastclick与zepto的 tap事件关于在手机上click事件的300ms延迟的区别

    之前翻译过一篇关于fastclick的快速点击文章http://www.cnblogs.com/lilyimage/p/3568773.html,fastclick可以解决在手机上点击事件的300ms ...

  4. 分享一个移动项目中消除click事件点击延迟的方法

    对于前端工程师来说,apicloud无疑给我们提供了很好的平台,有各种各样的模块供我们使用,但是在实际项目的时候,很大部分的代码,还是需要我们用html css js来实现的.但是呢,移动端页面对于c ...

  5. JS Event事件流(冒泡机制、捕获机制、事件绑定)

    1.事件流 事件流:从页面中接收事件的顺序.也就是说当一个事件产生时,这个事件的传播过程,就是事件流. IE的事件流 IE中的事件流叫事件冒泡:事件冒泡:事件开始时由最具体的元素接收,然后逐级向上传播 ...

  6. javascript创建css、js,onload触发callback兼容主流浏览器的实现

    http://www.fantxi.com/blog/archives/load-css-js-callback/ 由于需要写个函数,既可以加载css,又可以加载js,所以对各主流浏览器对加载js.c ...

  7. 在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件

    在js文件中通过jquery定位到某个dom时候设置事件时候 相当于直接在dom里面添加事件  当触发事件时候 会把当前的dom传给该方法

  8. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  9. js立即执行函数应用--事件绑定

    js中立即执行函数的应用:应用到事件绑定上. 少说多做,直接运行代码(代码中有注释): <!DOCTYPE html> <html lang="zh"> & ...

随机推荐

  1. 《DSP using MATLAB》Problem 5.10

    代码: 第1小题: %% ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ %% Out ...

  2. LG3187 [HNOI2007]最小矩形覆盖

    题意 题目描述 给定一些点的坐标,要求求能够覆盖所有点的最小面积的矩形,输出所求矩形的面积和四个顶点坐标 输入输出格式 输入格式: 第一行为一个整数n(3<=n<=50000),从第2至第 ...

  3. Vue的路由动态重定向和导航守卫

    一.重定向 重定向也是通过 routes 配置来完成,下面例子是从 /a 重定向到 /b: const router = new VueRouter({ routes: [ { path: '/a', ...

  4. 黑马-ssh

    插件 Struts-plugin.xml 说明: Struts-plugin.xml文件是在tomcat服务器启动的时候加载的 该配置文件在classpath的根目录下 在每一个含有plugin字母的 ...

  5. drone 1.0 新的构建徽章特性

    drone 1.0 昨天新发布的功能,支持了一个方便的查看构建状态的功能徽章 如下: 环境准备 docker-compose 文件 version: '3' services: drone-serve ...

  6. 求Sn=a+aa+aaa+aaaa+aaaaa的前5项之和,其中a是一个数字

    思路:所求和为一个数字的前n项和,例如前4项和就是从4+44+444+4444,一直加到第4位,为4个4.所以可以用一个循环来表示每一项的数字,加到前几项就循环几次.然后将每项进行相加就可以求出总和. ...

  7. MySQL创建计算字段

    数据库中数据表的格式一般不是应用程序所需要的格式,如: 在一个字段中既显示公司名有显示公司地址,但这两个数据一般不在一张表中 城市,州和邮政编码在不同的列中,但邮件标签打印程序需要把他们作为一个恰当的 ...

  8. java jvm设置http代理参数

    -Dhttp.proxyHost=127.0.0.1 -Dhttp.proxyPort=1080

  9. 【java】注释

    一.注释   1. 注释类型 [a]. 单行注释 // 单行注释 [b]. 多行注释 /* 多行注释 */ [c]. 文档注释 /** 文档注释 */ 一般情况下,需求,实现方式用多行注释,类和方法上 ...

  10. FastReport问题整理(http://129.sqdj.gov.cn/?p=77)

    1.FastReport中如果访问报表中的对象?可以使用FindObject方法.TfrxMemoView(frxReport1.FindObject(’memo1′)).Text:=’FastRep ...