Three ways to _javascript the JavaScript pop-up dialog box tips

The small partners who have learned JS will find that we used the alert () method, the prompt () method, the prompt () method in some instances, and they all pop up a dialog box on the screen and display the parentheses inside, using this method to make the page interactive more exciting, In fact, we often use this type of dialog when browsing the Web, often using dialog boxes when users interact with the application in a two-way way.

JavaScript's three dialog boxes are obtained by calling the Window object's three method alert (), confirm () and prompt () , which can be used to complete the input and output of JS, and realize the JS code that can interact with the user.

Today's small series to introduce a simple JS three kinds of pop-up dialog box, small set first alone on these several methods for detailed explanation, and then, the comparison of these methods, OK, start our JS trip bar (*∩_∩*) ...

First: Alert () method

The alert () method is one of the easiest to use in these three dialog boxes, she can be used to simply and clearly display the text information in alert () brackets in a dialog box, which we call the Alert dialog box, where the information to display is placed in parentheses, and the dialog box contains a confirmation button. Once the user has finished reading the displayed information, you can close the dialog box by simply clicking the button. Let's look at an example using the alert () method, which looks like this:

Execute the small example above, pop up a dialog on the page and display a word "allied: The ancient wood withered under the Rocks", as follows:

Next, click the Confirm button and then display the second dialog box and display "White Water fountain girl wonderful!" ", the effect is as follows;

Pop up a dialog box on the page and display a word "Top: Rocky Rock", click the "Confirm" button and then display the 2nd dialog box and display "White Water fountain girl wonderful!" "Let's analyze This little example:

A, the alert () method is called two times in the <script> script block;

b, in each alert () brackets added a piece of text information, run the page shown in the following figure, when the mouse click on the page "OK" button, the second page appears, and then click the "OK" button to close the dialog box on the page. Note: The two dialog boxes are displayed separately, not one covering the other, because JS actually executes the first alert () and waits until the user clicks the "Confirm" button before executing the second alert ().

Alert () is a method of a JS window object that can be written as Window.alert (), or as alert (), and the function is to produce a dialog box with a confirmation button that displays the information in parentheses.

The second type: Confirm () method

The Confirm () method is very similar to the alert () method, except that there is a "cancel" button on the dialog box, in addition to a "confirmation" button, which is called a confirmation dialog box, which calls the Window object's confirm () Method and the prompt () method described later, you can also not write Windows. Let's look at a small example of confirm (), which looks like this:

The display effect is as follows:

Analyze This small example:

A, add the Confirm () method in the <script> script block,

b, in the Confirm () brackets added a piece of text information, the effect as shown in the figure above, if the user clicks the Confirm button, the Confirm () method returns True, if the user clicks the Cancel button, the Confirm () method returns False, Regardless of which button the user chooses, the dialog box closes, and the JavaScript code continues to execute. Click the Confirm or Cancel button to close the dialog box. There seems to be no difference, in fact, whether you click the "Confirm" or "Cancel" button will return a Boolean value, so that there are some JS code behind the scenes to play the role of the button, please see the following example, experience using confirm () Returns the beauty of a Boolean value. The code is as follows:

Let's analyze This small example:

A, in the <script> script block declared a variable con.

B, Con=confirm () assigns the Boolean value returned by the Confirm () method to con.

C, using the IF statement to use the value of the con, the execution of different statements, the effect is as follows:

If you click the OK button on the confirmation box for the page, the page appears as shown in the following illustration:

If you click the Cancel button, the page appears as shown in the following illustration:

The third type: Prompt () method

The alert () method and the Confirm () method are very similar in that they show only existing information, but the user cannot enter his or her own information, but prompt () can do this, not only to display information, but also to provide a text box that requires the user to enter his or her own information using the keyboard. She also includes a "confirm" or "Cancel" two buttons, if the user "confirms" the button, the prompt () method returns what the user entered in the text box (is a string type) or the initial value (if the user does not enter information), or if the user clicks the Cancel button, prompt () method returns NULL, which we call the dialog box, and in these three dialog boxes, she has the best interactivity.

See the following small example: On the page two pop-up prompts dialog box, so that users can enter the information, the code is as follows:

Run the above program, the effect is as follows:

Click OK, there will be such a surprise nie:

Let's click on the OK button again:

Click the OK button again:

Analyze This small example

A, two prompt () methods were added to the <script> script block.

b, a text message is added to the first prompt () bracket.

C, Name=prompt () is to assign the information that the user enters in the text box to the variable name.

The difference and connection between alert (), confirm (), prompt ():

Alert Box alert ()

Alert is a warning box with only one button "OK" with no return value, and the warning box is often used to ensure that the user can get some information. When the warning box appears, the user needs to click on the OK button to continue the operation. Syntax: alert ("text").

Confirmation Box confirm ()

Confirm is the confirmation box, two buttons, OK or Cancel, return True or false. The confirmation box is used to enable users to authenticate or accept certain information. When the confirmation box appears, the user needs to click OK or Cancel button to continue the operation. If the user clicks Confirm, then the return value is true. If the user clicks Cancel, the return value is false. Syntax: Confirm ("text")

Prompt box prompt ()

Prompt is a prompt box that returns the input message, or its default value prompt box is often used to prompt the user to enter a value before entering the page. When the prompt box appears, the user needs to enter a value and then click the Confirm or Cancel button to continue manipulating. If the user clicks Confirm, the return value is the value entered. If the user clicks Cancel, the return value is null. Syntax: Prompt ("text", "Default value")

This article mainly introduces three kinds of pop-up dialog boxes in JavaScript, respectively, the alert () method, the Confirm () method, the prompt () method, the small part first introduces these methods in detail, followed by the comparison of these methods, in addition to these three pop-up dialog boxes, We can also use document.write () directly to display the message on the page, BS Learning, not to be continued ... At the same time, thank you all have been to cloud Habitat Community support site!