JavaScript zur Implementierung des Countdowns für den SMS-Versand
|
In diesem Artikel wird der spezifische JavaScript-Code zur Implementierung des Countdowns für das Senden von SMS zu Ihrer Information bereitgestellt. Der spezifische Inhalt ist wie folgt Umsetzungsideen: 1. js ruft das Elementobjekt der Schaltfläche „Senden“ ab Codebeispiel:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta http-equiv="X-UA-kompatibel" content="IE=edge">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>SMS senden</title>
<Stil>
.Kasten {
Breite: 360px;
Rand: 100px automatisch;
}
</Stil>
</Kopf>
<Text>
<div Klasse="Box">
Mobiltelefonnummer: <input type="number">
<button>SMS senden</button>
</div>
<Skript>
var btn = document.querySelector('Schaltfläche');
var Zeit = 10;
btn.addEventListener('klicken', function() {
btn.deaktiviert = wahr;
var Timer = Intervall setzen(Funktion() {
wenn (Zeit == 0) {
// Timer löschen und Schaltfläche wiederherstellen clearInterval(timer);
btn.deaktiviert = falsch;
btn.innerHTML = 'SMS senden';
Zeit = 10;
} anders {
btn.innerHTML = 'verbleibend' + Zeit + 'Sekunden';
Zeit--;
}
}, 1000);
});
</Skript>
</body>
</html>Seiteneffekt:
Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Lösen Sie das Problem mehrerer Listener, die beim Starten von Tomcat in Idea gemeldet werden
>>: So migrieren Sie lokales MySQL in eine Serverdatenbank
Artikel empfehlen
Wissen zur Suchmaschinenoptimierung, auf das Sie beim Webdesign achten sollten
1. Linklayout der neuen Site-Startseite 1. Die Pos...
Detaillierte Erläuterung der Prinzipien des tiefen und flachen Klonens von JavaScript-Arrays und Nicht-Array-Objekten
Inhaltsverzeichnis Was sind flaches und tiefes Kl...
Detaillierte Erklärung zur Verwendung des Grep-Befehls in Linux
1. Offizielle Einführung grep ist ein häufig verw...
Installationsschritte der Ubuntu 20.04-Doppelpinyin-Eingabemethode
1. Chinesische Eingabemethode einrichten 2. Stell...
MySQL Server 8.0.13.0 Installations-Tutorial mit Bildern und Text
Installieren Sie 8.0.13 basierend auf MySQL 6.1.3...
Implementierung der Docker-Batch-Container-Orchestrierung
Einführung Der Dockerfile-Build-Ausführungsvorgan...
Detaillierte Erläuterung der Vuex-Persistenz in der praktischen Anwendung von Vue
Inhaltsverzeichnis Vuex-Persistenz Zusammenfassen...
Detaillierte Erklärung der Verwendung und Unterschiede von MySQL-Ansichten und -Indizes
MySQL-Ansichten Einfach ausgedrückt ist eine MySQ...
Grundlegende Operationen von MySQL-Datentabellen: Operationen in der Tabellenstruktur, Beispielanalyse von Feldoperationen
Dieser Artikel beschreibt anhand von Beispielen d...
Einige Erkenntnisse und Gedanken zu iframe
Diese Geschichte beginnt heute mit einer unerwarte...
So richten Sie den PostgreSQL-Start unter Ubuntu 16.04 ein
Da PostgreSQL kompiliert und installiert ist, müs...
Windows Server 2016 – Kurzanleitung zur Bereitstellung von Remotedesktopdiensten
Jetzt unterstützt der 2016-Server den Multi-Site-...
Detaillierte Erklärung des Unterschieds zwischen Flex und Inline-Flex in CSS
inline-flex ist dasselbe wie inline-block. Es ist...
Detaillierte Beschreibung von nginx von der Kompilierung und Installation bis zur Beschreibung der Konfigurationsdatei auf Chinesisch
Dieser Artikel stellt Nginx ausführlich vor, von ...
Verschiedene Transformationseffekte beim Umschalten von HTML-Webseiten
<META http-equiv="Seite eingeben" CON...