chevron_left

原生 JavaScript 教程
免费
第 4.5 回

教程文档

原生 JavaScript 教程 - 防抖

2023年11月13日
原生 JavaScript 教程

防抖

概念

在第一次触发事件时，不立即执行函数，而是给出一个期限值比如 1000ms，然后：

  • 如果在 1000ms 内没有再次触发事件，那么就执行函数
  • 如果在 1000ms 内再次触发事件，那么清除之前的计时器，重新开始计时

示例代码

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
</head>
<body>

<input type="text" id="input">

<script>
    var input = document.querySelector("#input")

    var timer;
    input.onkeyup = function () {
        // 停止操作后才执行1次
        // 如果连续操作，则之前的延迟执行都被清除了

        clearTimeout(timer)
        timer = setTimeout(function () {
...
请登录后查看更多expand_more

课程介绍

此教程由长乐未央官方出品，目的是让新手能在最短的时间系统学会前端。

JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的高级编程语言。虽然它是作为开发 Web 页面的脚本语言而出名的，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。

JavaScript 是一种属于网络的高级脚本语言，已经被广泛用于 Web 应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。通常 JavaScript 脚本是通过嵌入在 HTML 中来实现自身的功能的。

目录

适合这样的人

新手

授课老师