Verwenden Sie Javascript, um die Funktion zum Senden des SMS-Bestätigungscodeintervalls zu implementieren
|
Wenn wir uns in vielen Apps und Websites anmelden oder ein Konto registrieren, gibt es eine Möglichkeit, SMS-Bestätigungscodes 1 zu senden. Um jedoch den böswilligen Erwerb von Bestätigungscodes zu verhindern, legen wir im Allgemeinen ein anklickbares Zeitintervall fest. Nach Ablauf des Zeitintervalls 1 kann es weiter gesendet werden. Verwenden Sie als Nächstes Code zur Implementierung Der Code lautet wie folgt
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>Titel</title>
</Kopf>
<Text>
Mobiltelefonnummer: <input type="text"><button>Bestätigungscode senden</button>
<Skript>
var btn = document.querySelector('Schaltfläche')
var Zeit = 3
btn.addEventListener('klicken',Funktion () {
btn.disabled=true
var Timer = Intervall festlegen(Funktion () {
wenn (Zeit<0){
Intervall löschen(Timer)
btn.disabled=false
btn.innerHTML = 'Bestätigungscode senden'
Zeit = 3
}anders {
btn.innerHTML = 'verbleibend' + Zeit + 'Sekunden'
Zeit -= 1
}
},1000)
})
</Skript>
</body>
</html>Die Wirkung ist wie folgt
Codeerklärung <br /> Da wir hier nur den Stil und die Funktion der Schaltfläche ändern, erhalten wir nur die Schaltfläche und legen dann eine Zeitvariable fest, die die Countdown-Zeit darstellt. Legen Sie dann das Klickereignis fest. Wenn wir auf diese Schaltfläche klicken, wird die Deaktivierung dieser Schaltfläche wahr, was bedeutet, dass sie nicht angeklickt werden kann. Dies ist das Ende dieses Artikels über die Verwendung von Javascript zum Implementieren des Intervalls zum Senden von SMS-Bestätigungscodes. Weitere relevante JS-Inhalte zum Senden von SMS-Bestätigungscodes finden Sie in den vorherigen Artikeln von 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:
|
<<: Wartungsmethode für den Innodb-Systemtabellenbereich
>>: Allgemeiner Leitfaden zur Sicherheitskonfiguration von Linux/CentOS-Servern
Artikel empfehlen
Implementierung von Nginx-Filterzugriffsprotokollen für statische Ressourcendateien
Unordentliches Protokoll Nginx wird im täglichen ...
So nutzen Sie die Multi-Core-CPU in node.js voll aus
Inhaltsverzeichnis Überblick So nutzen Sie die Mu...
So konvertieren Sie eine Zeichenfolge in JavaScript in eine Zahl
Inhaltsverzeichnis 1.parseInt(Zeichenfolge, Basis...
Zusammenfassung der grundlegenden Operationen für MySQL-Anfänger
Bibliotheksbetrieb Abfrage 1.SHOW DATABASE; ----A...
202 kostenlose, hochwertige XHTML-Vorlagen (1)
Hier präsentiert 123WORDPRESS.COM den ersten Teil...
Teilen Sie 20 JavaScript-Einzeilencodes
Inhaltsverzeichnis 1. Holen Sie sich den Wert des...
CSS-Pickup-Pfeile, Kataloge, Icons Implementierungscode
1. Verschiedene CSS-Symbole Es gibt drei Möglichk...
HTML-Tabellen-Tag-Tutorial (35): spaltenübergreifendes Attribut COLSPAN
In einer komplexen Tabellenstruktur erstrecken si...
React+Typescript implementiert die Countdown-Hook-Methode
Zunächst wird setInterval als Hook gekapselt 👇 im...
Installieren Sie Tomcat und stellen Sie die Website unter Linux bereit (empfohlen)
Installieren Sie JDK: Offizieller Oracle-Download...
Vue-Beispielcode für die Online-Vorschau von Office-Dateien
Ich arbeite derzeit an elektronischen Archiven un...
Tutorial zur grundlegenden Verwendung des MySQL Slow Query Log
Parameter im Zusammenhang mit dem langsamen Abfra...
15 Vim-Kurzreferenztabellen, die Ihnen helfen, Ihre Effizienz um das N-fache zu steigern
Ich habe im ersten Halbjahr des letzten Jahres an...
Vergleich von CSS-Schatteneffekten: Schlagschatten und Box-Schatten
Drop-Shadow und Box-Shadow sind beide CSS-Eigensc...
Welche Beziehung besteht zwischen Mapper-SQL-Anweisungsfeldern und Entitätsklassen-Attributnamen?
Hintergrund: 1. Es gibt eine Benachrichtigungstab...