<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>防抖</title>

</head>

<body>

<button id="debounce">防抖，防抖，防抖</button>

<script>

    window.onload = function () {

        let obtn = document.getElementById('debounce'); //获取按钮

        obtn.addEventListener('click',debounceHandle(debounce),false); //监听绑定事件

    }

    //防抖函数

    function debounceHandle (fn) {

        let timer = null;

        return function () {

            clearTimeout(timer); //如果存在事件就清除定时器

            timer = setTimeout(function(){ //如果不存在那么就开启定时器

                fn(this);

            },300)

        }

    }

    //执行函数

    function debounce() {

        console.log('防抖，防抖，防抖');

        //这里写要执行的代码

    }

</script>

</body>

</html>

　　

前端防抖，double click 克星的更多相关文章

  1. Text selection in div(contenteditable) when double click

    背景: 在最近项目中,碰到一个问题:有一个可编辑的div需要双击时可编辑,blur或者回车时将编辑结果保存.你可能注意到双击时,文字会被选中,可编辑区域不会focus到光标位置.考虑到兼容性问题,写了 ...

  2. Implementing On Item Click / Double Click for TListView

    ListView.On Item Click & ListView.On Item Double Click To be able to locate the clicked (if ther ...

  3. [Python學習筆記] 使用 selenium 抓取網頁並且雙擊滑鼠 (double click)

    一開始使用的時候 看官方文件 以為使用 double_click()即可 但後來出現錯誤 AttributeError: 'WebElement' object has no attribute 'd ...

  4. 陈年佳酿之 - Winform ListView 控件 double click 事件中获取选中的row与column

    背景 最近收到了一个关于以前项目的维护请求,那时的楼主还是刚刚工作的小青年~~~ 项目之前使用的是.net/winform.今天重新打开代码,看着之前在FrameWork2.0下面的代码, 满满的回忆 ...

  5. win10家庭版，双击bat文件无法运行（double click bat file does not execute）

    win10家庭版,双击bat文件无法运行,弹出文件打开方式选择框. 在网上搜索处理办法,试了以下方法1-5都没有成功,用方法6规避. 方法1:打开一个驱动器,点“工具-文件夹选项→文件类型→新建→扩展 ...

  6. 纯前端表格控件SpreadJS V12.1 隆重登场，专注易用性，提升用户体验

    ​ 一款优秀的开发工具,在更新迭代中,除了要满足不同场景的业务需求,也需不断优化已有功能,尤其是细节方面,要能为用户带来使用体验和开发效率的提升. 作为一款备受业界专家和开发者认可的纯前端类Excel ...

  7. WPF button 如何区分click和doubleclick

    WPF button 同时处理两个事件时候会先触发click事件,触发doubleclick事件  ,那如何区分呢,可以这样设置: private static DispatcherTimer myC ...

  8. [Reactive Programming] Using an event stream of double clicks -- buffer()

    See a practical example of reactive programming in JavaScript and the DOM. Learn how to detect doubl ...

  9. removing right click context menu options on recycle bin

    Humpty is correct as always  First you might want to make a backup of the reg key then remove the Wa ...

随机推荐

  1. springboot打包第三方jar包是失败

    在项目开发时有时我们需要引入一些在maven仓库中不存在的包 一.配置maven环境变量 在path环境变量中添加 %maven_home%\bin (window10环境下) cmd界面输入 mvn ...

  2. Android WebView优化

    1.展示webview的activity可以另开一个进程,这样就能和我们app的主进程分开了,即使webview产生了oom崩溃等问题也不会影响到主程序,如何实现呢,其实很简单,在androidman ...

  3. k8s-pv-pvc

    1. 简介 持久卷(PersistentVolume,PV)是集群中的一块存储,可以由管理员事先供应,或者 使用存储类(Storage Class)来动态供应. 持久卷是集群资源,就像节点也是集群资源 ...

  4. 1120day-户别确认

    1.实体类 package com.edu.empity; public class People { private String hubie; private String livetype; p ...

  5. Cesium中级教程4 - 空间数据可视化（二）

    Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ Viewer中的Entity功能 让我们看看Viewer为操作e ...

  6. WebGPU相关的资源学习和社区

    我在网上搜寻了很多关于WebGPU相关的资料: #我觉得首先在B站上看到的徐博士免费教程非常好,讲解详细,并且评论回复比较快,都会有回应,徐博士B站网址:https://space.bilibili. ...

  7. 很详细的FFT（快速傅里叶变换）概念与实现

    FFT 首先要说明一个误区,很多人认为FFT只是用来处理多项式乘的,其实FFT是用来实现多项式的系数表示法和点值表示法的快速转换的,所以FFT的用处远不止多项式乘. FFT的前置知识:点值表示法,复数 ...

  8. 学习axios必知必会（2）~axios基本使用、使用axios前必知细节、axios和实例对象区别、拦截器、取消请求

    一.axios的基本使用: ✿ 使用axios前必知细节: 1.axios 函数对象(可以作为axios(config)函数使用去发送请求,也可以作为对象调用方法axios.request(confi ...

  9. python+fastdfs+nginx实现打包下载功能

    环境介绍:生产服务器开发人员需要给client下发数据,主要是图片及视频:图片服务器用fastdfs,下载由nginx 来提供: java 程序来调用此脚本,传递参数来决定打包文件内容: #!/usr ...

  10. Base64补充

    1.Base64简单说明 描述:Base64可以成为密码学的基石,非常重要. 特点:可以将任意的二进制数据进行Base64编码 结果:所有的数据都能被编码为并只用65个字符就能表示的文本文件. 65字 ...