Beispiel für ein JavaScript-Meldungsfeld
|
In JavaScript können drei Arten von Meldungsfeldern erstellt werden: Warnfelder, Bestätigungsfelder und Eingabeaufforderungsfelder. WarnfeldWarnfelder werden normalerweise verwendet, um sicherzustellen, dass Benutzer bestimmte Informationen erhalten. Wenn das Warnfeld angezeigt wird, muss der Benutzer auf die Schaltfläche „OK“ klicken, um den Vorgang fortzusetzen. Syntaxformat:
window.alert("Warntext");Beispiel-Quellcode:
<!DOCTYPE html>
<html>
<Kopf>
<meta charset="utf-8">
<title>Beispiel für eine JS-Warnmeldung</title>
<Skript>
Funktion meineFunktion(){
alert("Hehe, das ist ein Warnfeld!");
}
</Skript>
</Kopf>
<Text>
<input type="button" onclick="myFunction()" value="Warnfeld anzeigen" />
</body>
</html>Speichern unter: JS Warning Box example.html Führen Sie den Test mit einem Browser aus. Die Ergebnisse sind wie folgt:
BestätigungsfeldBestätigungsfelder werden häufig verwendet, um zu überprüfen, ob eine Benutzeraktion akzeptiert wurde. Wenn das Bestätigungsfeld angezeigt wird, kann der Benutzer auf „Bestätigen“ oder „Abbrechen“ klicken, um den Benutzervorgang zu bestätigen. Wenn Sie auf „Bestätigen“ klicken, gibt das Bestätigungsfeld „True“ zurück, wenn Sie auf „Abbrechen“ klicken, gibt das Bestätigungsfeld „False“ zurück. Syntaxformat:
window.confirm("text");Beispiel-Quellcode:
<!DOCTYPE html>
<html>
<Kopf>
<meta charset="utf-8">
<title>Beispiel einer JS-Bestätigungsbox</title>
</Kopf>
<Text>
<p>Klicken Sie auf die Schaltfläche, um ein Bestätigungsfeld anzuzeigen. </p>
<button onclick="myFunction()">Klick mich</button>
<p id="demo"></p>
<Skript>
Funktion meineFunktion(){
var x;
var r=confirm("Hehe, das ist ein Box-Beispiel!");
wenn (r==true){
//x="Sie haben die Schaltfläche \"OK\" gedrückt!";
x='Sie haben die Schaltfläche "OK" gedrückt!';
}
anders{
//x="Sie haben die Schaltfläche \"Abbrechen\" gedrückt!";
x='Sie haben die Schaltfläche "Abbrechen" gedrückt!';
}
document.getElementById("demo").innerHTML=x;
}
</Skript>
</body>
</html>Speichern unter: JS Bestätigungsbox example.html Führen Sie den Test mit einem Browser aus. Die Ergebnisse sind wie folgt:
Trinkgeld-BoxEingabeaufforderungsfelder werden normalerweise verwendet, um Benutzer aufzufordern, vor dem Aufrufen der Seite einen Wert einzugeben. Wenn das Eingabeaufforderungsfeld angezeigt wird, muss der Benutzer einen Wert eingeben und dann auf die Schaltfläche „Bestätigen“ oder „Abbrechen“ klicken, um den Vorgang fortzusetzen. Wenn der Benutzer auf „OK“ klickt, ist der Rückgabewert der eingegebene Wert. Wenn der Benutzer auf „Abbrechen“ klickt, ist der Rückgabewert null. Syntaxformat:
window.prompt("Eingabeaufforderungstext","Standardwert");Beispiel-Quellcode:
<!DOCTYPE html>
<html>
<Kopf>
<meta charset="utf-8">
<title>Beispiel für eine JS-Eingabeaufforderung</title>
</Kopf>
<Text>
<p>Klicken Sie auf die Schaltfläche, um den Eingabedialog anzuzeigen. </p>
<button onclick="myFunction()">Klick mich</button>
<p id="demo"></p>
<Skript>
Funktion meineFunktion(){
var x;
var person = prompt("Bitte geben Sie Ihren Namen ein", "Tom");
wenn (Person!=null && Person!=""){
x="Hallo" + Person + "! Wie fühlst du dich heute?";
document.getElementById("demo").innerHTML=x;
}
}
</Skript>
</body>
</html>Speichern unter: JS-Eingabeaufforderungsfeld example.html Führen Sie den Test mit einem Browser aus. Die Ergebnisse sind wie folgt:
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:
|
<<: So verwenden Sie mysqladmin, um die aktuellen TPS und QPS einer MySQL-Instanz abzurufen
>>: Lösen Sie schnell das Problem des langsamen Tomcat-Starts, super einfach
Artikel empfehlen
Lassen Sie uns über das v-on-Parameterproblem in Vue sprechen
Verwendung von v-on:clock in Vue Ich lerne derzei...
Beispielcode für die JS-Funktion „Anti-Shake“ und „Throttling“ zur Entwicklung von Webprojekten
Inhaltsverzeichnis Stabilisierung Einführung Anti...
Drei Möglichkeiten, doppeltes Einfügen von Daten in MySql zu vermeiden
Vorwort Im Falle eines Primärschlüsselkonflikts o...
Detaillierte Erläuterung des Beispielcodes für die Verbesserungen und Änderungen, die CSS-Variablen bei der Entwicklung interaktiver JS-Komponenten mit sich bringen
1. Qualitative Änderungen durch CSS-Variablen Die...
Lösen Sie schnell das Problem des langsamen Tomcat-Starts, super einfach
Heute habe ich einem Klassenkameraden geholfen, e...
JavaScript zum Erzielen eines Skin-Effekts (Ändern des Hintergrunds)
In diesem Artikel wird der spezifische JavaScript...
XHTML-Tutorial für die ersten Schritte: XHTML-Webseiten-Bildanwendung
<br />Das sinnvolle Hinzufügen von Bildern k...
Detaillierte Erklärung des Skript-Debugging-Mechanismus in Bash
Ausführen des Skripts im Debugmodus Sie können da...
Detailliertes Tutorial zur Installation von Nginx auf CentOS8 (Bild und Text)
Nginx, ausgesprochen „Engine x“, ist ein Open Sou...
Verständnis des CSS-Selektorgewichts (persönlicher Test)
Code kopieren Der Code lautet wie folgt: <styl...
Vue+Swiper realisiert Timeline-Effekt
In diesem Artikel wird der spezifische Code von v...
Konfigurationsmethode für das Nginx-Anforderungslimit
Nginx ist ein leistungsstarker, leistungsstarker ...
Implementierung der Nginx-Konfiguration https
Inhaltsverzeichnis 1: Bereiten Sie das https-Zert...
CSS-Probleme bei der gemeinsamen Verwendung von „Position:fixed“ und „Margin-top“ auf Elementen derselben Ebene
Problembeschreibung Ich möchte CSS verwenden, um ...
So aktualisieren Sie MySQL 5.6 auf 5.7 unter Windows
Vorne geschrieben Es gibt zwei Möglichkeiten, MyS...