javascript: warning (alert message dialog box), confirm (confirm message dialog box)

Keywords: Javascript

When we visit the website, we sometimes pop up a small window with a piece of prompt message written on it. If you don't click "OK", you can't do anything to the web page. This small window is implemented by using alert.

Note: the alert pop-up message dialog box contains a OK button.

Syntax:

Alert (string or variable);  

Be careful:

1. No other operation can be performed before clicking "OK" button in the dialog box.

2. Message dialog box can be used to debug programs.

3. The output of alert can be a string or a variable, similar to document.write.

 
  1. <title>alert</title>  
  2.   <script type="text/javascript">  
  3.   function rec(){  
  4.     var mychar="I love JavaScript";  
  5.     alert(mychar);  
  6.   }  
  7.   </script>  
  8. </head>  
  9. <body>  
  10.     <input name="button" type="button" onClick="rec()" value="Click me and a dialog box will pop up" />  
  11. </body>  

Confirm (confirm message dialog box)

The confirm message dialog is usually used to allow the user to make a selection action, such as: "are you right?" And so on. Pop up dialog box (including a OK button and a cancel button).

Syntax:

confirm(str);

Parameter Description:

str: text to display in the message dialog
 Return value: Boolean value

Return value:

Returns true when the user clicks the "OK" button
 Return to false when the user clicks "Cancel"

Note: the return value can be used to judge what button the user clicked



  1. <script type="text/javascript">  
  2.   
  3. function rec()  
  4. {  
  5.     var mymessage=confirm("You like it javascript Do you?");  
  6.     if(mymessage==true)  
  7.     {  
  8.         document.write("Good, come on!");  
  9.     }  
  10.     else if(mymessage==false)  
  11.     {  
  12.         document.write("To learn javascript,And you have to learn");  
  13.     }  
  14. }  
  15. </script>  
  16.       
  17. </head>  
  18.   
  19. <body>  
  20.     <input type="button" name="button" value="Click me to open the confirmation dialog box" onclick="rec()" />  
  21. </body>  


  1. <script type="text/javascript">  
  2. function resc()  
  3. {  
  4.     var myname=prompt("Please enter your name");  
  5.     if(myname!=null)  
  6.     {  
  7.         document.write("Hello"+myname);  
  8.     }  
  9.     else  
  10.     {  
  11.         document.write("Hello"+Friend);  
  12.     }  
  13. }  
  14. </script>  

  1. <body>  
  2.     <input type="button" name="button" value="Click me to open the question dialog box" onclick="resc()" />  
  3. </body>  
Be careful:
1. alert is a pop-up warning box. You can add a line break in the text.
2. confirm pops up the confirmation box and returns the Boolean value, which can be used to judge whether to confirm or cancel when clicking. true means Click to confirm, false means Click to cancel.
3. prompt pops up the input box, click OK to return to the value in the input box, and click Cancel to return to null.
Here is a detailed example:
  1. <html>  
  2. <head>  
  3. <script type="text/javascript">  
  4. function show_alert(){  
  5.     alert('first line\n Second elements');  
  6. }  
  7.   
  8. function show_confirm(){  
  9.     var result = confirm('Delete or not!');  
  10.     if(result){  
  11.         alert('Delete successfully!');  
  12.     }else{  
  13.         alert('Do not delete!');  
  14.     }  
  15. }  
  16.   
  17. function show_prompt(){  
  18.     var value = prompt('Enter your name:', 'Default name');  
  19.     if(value == null){  
  20.         alert('You canceled the entry!');  
  21.     }else if(value == ''){  
  22.         alert('The name is blank, please re-enter!');  
  23.         show_prompt();  
  24.     }else{  
  25.         alert('Hello,'+value);  
  26.     }  
  27. }  
  28. </script>  
  29. </head>  
  30. <body>  
  31. <input id="alert_button" type="button" value="alert" onclick="show_alert()" >  
  32. <input id="confirm_button" type="button" value="confirm" onclick="show_confirm()" >  
  33. <input id="prompt_button" type="button" value="prompt" onclick="show_prompt()" >  
  34. </body>  
  35. </html>  

Posted by Woolf on Fri, 03 Apr 2020 08:22:16 -0700