<!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. 【系统学习ES6】第二节：解构赋值

    [系统学习ES6] 本专题旨在对ES6的常用技术点进行系统性梳理,帮助大家对其有更好的掌握,希望大家有所收获. ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构.解构是一种打 ...

  2. Python科学计算类库

    Numpy是什么 Numpy是一个开源的Python科学计算库.使用Numpy,就可以很自然地使用数组和矩阵.Numpy包含很多实用的数学函数,涵盖线性代数运算.傅里叶变换和随机数生成等功能. 矩阵: ...

  3. 面试必问之 CopyOnWriteArrayList，你了解多少？

    一.摘要 在介绍 CopyOnWriteArrayList 之前,我们一起先来看看如下方法执行结果,代码内容如下: public static void main(String[] args) { L ...

  4. Docker 与 K8S学习笔记（十 二）容器间数据共享

    数据共享是volume的关键特性,今天我们来看一下通过volume实现容器与host.容器与容器之间共享数据. 一.容器与host共享数据 在上一篇中介绍到的bind mount和docker man ...

  5. day 8 求平均数

    fun()函数的功能:计算形参x所指数组中N个数的平均值,(这里全部取浮点数) 并输出,在将大于平均值的数放在形参y所指的数组中,在主函数输出. 效果还不错: 还存在需要优化的分析:其实存到y数组中的 ...

  6. MATLAB中插值算法实现

    %%%1.M文件%(1).以往少的程序可以在命令行窗口进行编码,但大量的程序编排到命令行窗口,%会有造成乱码的危险.(2).如果将命令编成程序存储在一个文件中(M文件),依次运行文件中的命令,则可以重 ...

  7. 【pwn】DASCTF Sept 九月赛

    [pwn]DASCTF Sept 月赛 1.hehepwn 先查看保护,栈可执行,想到shellcode 这题需要注意shellcode的写法 拖入ida中分析 一直以为iso scanf不能栈溢出, ...

  8. 常见Web服务器

    常见Web服务器

  9. mac 更新到big sur 后，parallels虚拟机的一些问题：由于您尚未获得访问其中一些文件的授权，所以您不能恢复“Windows 10

    由于您尚未获得访问其中一些文件的授权,所以您不能恢复"Windows 10 Mac上使用PD虚拟机,打开系统时提示"由于您尚未获得访问其中一些文件的授权,所以您不能恢复" ...

  10. CSS之常见布局|常用单位|水平垂直居中

    常见布局: 1. 流式布局:百分比布局,宽高.margin.pinding都是百分比 2. 固定布局:盒子的宽高固定,如:margin.padding等 3. 浮动布局:float 4. 弹性布局:f ...