Fallstudie zu JavaScript Anti-Shake
PrinzipDas Prinzip von Anti-Shake ist: Du kannst ein Ereignis auslösen, aber ich muss es n Sekunden nach dem Auslösen des Ereignisses ausführen. Wenn du dieses Ereignis innerhalb von n Sekunden nach dem Auslösen eines Ereignisses erneut auslöst, verwende ich die Zeit des neuen Ereignisses als Grundlage und führe es n Sekunden später aus. Kurz gesagt, ich werde nicht ausführen, bis Sie das Ereignis auslösen und innerhalb von n Sekunden keine weiteren Ereignisse ausgelöst werden. Fall
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<Kopf>
<meta charset="utf-8">
<meta http-equiv="x-ua-kompatibel" content="IE=edge, chrome=1">
<title>Entprellung</title>
<Stil>
* {
Rand: 0;
Polsterung: 0;
}
#Behälter {
Breite: 100 %;
Höhe: 200px;
Zeilenhöhe: 200px;
Textausrichtung: zentriert;
Farbe: #fff;
Hintergrundfarbe: #444;
Schriftgröße: 30px;
}
</Stil>
</Kopf>
<Text>
<div id="Container"></div>
<script src="debounce.js"></script>
</body>
</html>
Funktion getUserAction(e) {
konsole.log(dies);
konsole.log(e);
container.innerHTML = Anzahl++;
};
Funktion Entprellung(Funktion, warten) {
var Zeitüberschreitung;
Rückgabefunktion () {
Zeitüberschreitung löschen (Zeitüberschreitung);
Zeitüberschreitung = setzeZeitüberschreitung(() => {
func.apply(this, arguments); // Löse this und das Ereignisobjekt event
}, Warten);
}
}
container.onmousemove = Entprellung(getUserAction, 1000); Dies ist das Ende dieses Artikels über die Fallstudie zu JavaScript Anti-Shake. Weitere relevante Inhalte zu JavaScript Anti-Shake finden Sie in früheren Artikeln auf 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: Detaillierte Erläuterung der Umleitungskonfiguration und -praxis von Rewrite in Nginx
>>: MySQL kontrolliert die Anzahl der Versuche, falsche Passwörter einzugeben
Artikel empfehlen
Zwei Methoden zum Wiederherstellen von MySQL-Daten
1. Einleitung Vor einiger Zeit gab es eine Reihe ...
Analyse der MySql-Indexnutzungsstrategie
MySql-Index Indexvorteile 1. Sie können die Einde...
ElementUI implementiert kaskadierenden Selektor
In diesem Artikelbeispiel wird der spezifische Co...
Detaillierte Erklärung zur Verwendung von HTML-Header-Tags
HTML besteht aus zwei Teilen: Kopf und Text ** Da...
Zusammenfassung zur Positionierung in CSS
Es gibt vier Arten der Positionierung in CSS, die...
Verwenden von JavaScript in HTML
Das <script>-Tag In HTML5 hat Skript die fo...
So schreiben Sie HTML-Header in der Webentwicklung für mobile Geräte
Code kopieren Der Code lautet wie folgt: <Kopf...
Beispielcode für ein Mysql-SQL-Überwachungsskript für langsame Abfragen
1. Ändern Sie my.cnf #Der Gesamteffekt besteht da...
So erstellen Sie ein neues Image basierend auf einem vorhandenen Image in Docker
Das Erstellen neuer Images aus vorhandenen Images...
Eine kurze Analyse der Verwendung von USING und HAVING in MySQL
Dieser Artikel veranschaulicht anhand von Beispie...
MySQL 8.0.12 Installationskonfigurationsmethode und Kennwortänderung
In diesem Artikel werden die Installations- und K...
Beheben Sie den Gruppierungsfehler Ausdruck Nr. 1 der SELECT-Liste ist nicht in der GROUP BY-Klausel enthalten und enthält nicht aggregierte Werte in MySQL-Versionen über 5.7
Grund: MySQL 5.7.5 und höher implementiert die Er...
Grafisches Tutorial zur Installation und Konfiguration von MySQL 8.0.22 winx64
Das Tutorial zur Datenbankinstallation von MySQL-...
6 ungewöhnliche HTML-Tags
Zuerst: <abbr> oder <acronym> Diese be...
Detaillierte Erläuterung zum Erstellen eines Nginx-Websiteservers basierend auf CentOS7 (einschließlich der Konfiguration eines virtuellen Webhosts)
1. Nginx-Dienstgrundlage Nginx (Engine x) wurde s...