Home >Web Front-end >JS Tutorial >How to pop up a dialog box in javascript
How to pop up a dialog box in javascript
- 藏色散人Original
- 2021-05-11 11:07:168566browse
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.
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>
<head>
<title>编写html页面</title>
<script language="javascript"> //JavaScript脚本标注
alert("上联：山石岩下古木枯");//在页面上弹出上联
alert("下联：白水泉边少女妙");//在页面上弹出下联
</script>
</head>
</html>
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>
<head>
<title>编写html页面</title>
<script language="javascript"> //js脚本标注
confirm("上联：一但重泥拦子路；下联：两岸夫子笑颜回"); //在页面上弹出确认对话框
</script>
</head>
</html>
显示效果如下：
分析一下这个小例子：
a、在