ES6 - Dialogfelder

JavaScript unterstützt drei wichtige Arten von Dialogfeldern. Diese Dialogfelder können verwendet werden, um eine Eingabe auszulösen und zu alarmieren oder um eine Bestätigung für eine Eingabe zu erhalten oder um eine Art Eingabe von den Benutzern zu erhalten. Hier werden wir jedes Dialogfeld einzeln diskutieren.

Dialogfeld "Warnung"

Ein Warndialogfeld wird meistens verwendet, um eine Warnmeldung an die Benutzer zu senden. Wenn für ein Eingabefeld beispielsweise Text eingegeben werden muss, der Benutzer jedoch keine Eingabe bereitstellt, können Sie im Rahmen der Validierung ein Warnfeld verwenden, um eine Warnmeldung zu senden.

Trotzdem kann eine Warnbox für freundlichere Nachrichten verwendet werden. Das Warnfeld enthält nur eine Schaltfläche "OK" zum Auswählen und Fortfahren.

Beispiel

<html> 
   <head> 
      <script type = "text/javascript"> 
         function Warn() {  
            alert ("This is a warning message!");  
            document.write ("This is a warning message!");  
         } 
      </script> 
   </head> 

   <body> 
      <p>Click the following button to see the result: </p> 
      <form> 
         <input type = "button" value = "Click Me" onclick = "Warn();" /> 
      </form> 
   </body> 
</html>

Die folgende Ausgabe wird bei erfolgreicher Ausführung des obigen Codes angezeigt.

Bestätigungsdialogfeld

Ein Bestätigungsdialogfeld wird meistens verwendet, um die Zustimmung des Benutzers zu einer Option einzuholen. Es wird ein Dialogfeld mit zwei Schaltflächen angezeigt: OK und Abbrechen.

Wenn der Benutzer auf die Schaltfläche OK klickt, wird die Fenstermethode angezeigt confirm()wird true zurückgeben. Wenn der Benutzer auf die Schaltfläche Abbrechen klickt, gibt verify () false zurück. Sie können ein Bestätigungsdialogfeld wie folgt verwenden.

Beispiel

<html> 
   <head> 
      <script type = "text/javascript"> 
         function getConfirmation(){  
            var retVal = confirm("Do you want to continue ?");  
            
            if( retVal == true ){  
               document.write ("User wants to continue!");  
               return true;  
            } else {  
               Document.write ("User does not want to continue!");  
               return false;  
            }  
         }  
      </script> 
   </head> 

   <body> 
      <p>Click the following button to see the result: </p> 
      <form> 
         <input type = "button" value = "Click Me" onclick = "getConfirmation();" /> 
      </form> 
   </body> 
</html>

Die folgende Ausgabe wird bei erfolgreicher Ausführung des obigen Codes angezeigt.

Dialogfeld "Eingabeaufforderung"

Das Eingabeaufforderungsdialogfeld ist sehr nützlich, wenn Sie ein Textfeld öffnen möchten, um eine Benutzereingabe zu erhalten. Auf diese Weise können Sie mit dem Benutzer interagieren. Der Benutzer muss das Feld ausfüllen und dann auf OK klicken.

Dieses Dialogfeld wird mit einer Methode namens aufgerufen prompt() Dies erfordert zwei Parameter: (i) eine Beschriftung, die Sie im Textfeld anzeigen möchten, und (ii) eine Standardzeichenfolge, die im Textfeld angezeigt werden soll.

Dieses Dialogfeld verfügt über zwei Schaltflächen: OK und Abbrechen. Wenn der Benutzer auf die Schaltfläche OK klickt, gibt die Eingabeaufforderung für die Fenstermethode () den eingegebenen Wert aus dem Textfeld zurück. Wenn der Benutzer auf die Schaltfläche Abbrechen klickt, gibt die Fenstermethode prompt () null zurück.

Beispiel

<html> 
   <head> 
      <script type = "text/javascript"> 
         function getValue(){  
            var retVal = prompt("Enter your name : ", "your name here");  
            document.write("You have entered : " + retVal);  
         }  
      </script> 
   </head> 

   <body> 
      <p>Click the following button to see the result: </p> 
      <form> 
         <input type = "button" value = "Click Me" onclick = "getValue();" /> 
      </form> 
   </body> 
</html>

Die folgende Ausgabe wird bei erfolgreicher Ausführung des obigen Codes angezeigt.