Home > Web Front-end > JS Tutorial > body text

How to pop up a dialog box in javascript

藏色散人
Release: 2023-01-05 16:14:26
Original
8326 people have browsed it

How to implement the javascript pop-up dialog box: 1. Set the dialog box through the alert() method; 2. Set the dialog box through the confirm() method; 3. Set the prompt box through the prompt() method.

How to pop up a dialog box in javascript

The operating environment of this article: windows7 system, javascript version 1.8.5, Dell G3 computer.

Three pop-up dialog boxes in JavaScript

Friends who have studied js will find that we have used the alert() method and prompt() in some instances method, prompt() method, they both pop up a dialog box on the screen and display the content in brackets on it. Using this method makes the interactivity of the page more exciting. In fact, we often simply This type of dialog box is often used in two-way communication between users and applications. The three dialog boxes of avascript are obtained by calling the three methods alert(), confirm() and prompt() of the window object. These dialog boxes can be used to complete the input and output of js and realize js that can interact with the user. code. Today, the editor will briefly introduce the three pop-up dialog boxes in js. The editor will first explain these methods in detail separately, and then compare these methods. Okay, let’s start our js journey. `(*∩_∩*)′......
The first one: alert() method
The alert() method is these three dialogues The easiest one to use in the box, it can be used to simply and clearly display the text information in the alert() brackets in the dialog box. We call it an alert dialog box. The information to be displayed is placed in the brackets. The dialog box contains a Confirm button that the user can simply click to close the dialog box after they have finished reading the displayed information.
Let’s look at an example of using the alert() method. The code is as follows:



编写html页面


Copy after login

Execute the above small example to pop up a dialog on the page Frame and display the sentence "First line: Ancient trees withered under the rocks and rocks", as shown below:

Next, click the "Confirm" button and then the second dialog box will be displayed and "The girl beside the white water spring is wonderful!", the effect is as follows;

# pops up a dialog box on the page and display a sentence "Shanglian: Ancient wood under the rocky rock", After clicking the "Confirm" button, the second dialog box will be displayed and "The girl beside the white water spring is wonderful!" Let's analyze this small example:

a. In
b. A piece of text information is added in each alert() bracket, and the page shown below will appear when running. When you click the "OK" button on the page with the mouse, the second page appears. Click the "OK" button again to close the dialog box on the page. Note: The two dialog boxes are displayed separately, rather than one covering the other. This is 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 the JS window object. When called, it can be written as window.alert() or alert(). Its function is to generate a dialog box with a confirmation button, which displays the information in brackets,

Second: confirm() method

######

       confirm()方法与alert()方法的使用十分类似,不同点是在该种对话框上除了包含一个“确认”按钮外,还有一个“取消”按钮,这种对话框称为确认对话框,在调用window对象的confirm()方法以及后面介绍的prompt()方法时也可以不写window。下面来看一个关于confirm()的小例子,代码如下所示:   



编写html页面


Copy after login

       显示效果如下:

       

       分析一下这个小例子:
       a、在

Copy after login

       我们来分析一下这个小例子:

       a、在

Copy after login

       运行上面的程序,效果如下所示:

       

      点击确定,会有这么惊喜nie:

      

      我们再点击确定按钮:

       

##       And click the OK button:

     

Analyze this small example

a. Add two prompt() methods to the

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!