ES6 对象

ES6 对话框

JavaScript 支持三种类型的对话框 a> 是警报、确认、和提示。这些对话框可用于执行特定任务，例如发出警报、获得事件或输入的确认以及获得用户的输入。

让我们讨论每个对话框。

警报对话框

用于向用户提供警告信息。它是 JavaScript 中使用最广泛的对话框之一。它只有一个'OK'按钮来继续并选择下一个任务。

我们可以通过一个例子来理解它，比如假设一个文本字段是必须填写的，但是用户没有为该文本字段提供任何输入值，然后我们可以使用警报框显示警告消息。

语法

alert(message);

例子

让我们通过下面的例子来看看一个警告对话框的演示。

<html> 
  
<head>  
    <script type="text/javascript"> 
        function show() { 
            alert("It is an Alert dialog box"); 
        } 
    </script> 
</head> 
  
<body> 
    <center> 
        <h1>Hello World :) :)</h1> 
        <h2>Welcome to lidihuo</h2> 
        <p>Click the following button </p> 
        <input type="button" value="Click Me" onclick="show();" /> 
    </center> 
</body> 
  
</html>

输出

成功执行以上代码后，会得到如下输出。

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第1张

点击点击我按钮后，你会得到如下输出:

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第2张

确认对话框

广泛用于取意见从用户对具体选项。它包括两个按钮，确定和取消。举个例子，假设用户需要删除一些数据，那么页面可以通过是否要删除的确认框来确认。

如果用户点击OK 按钮，然后方法 confirm() 返回 true。但是如果用户点击取消按钮，confirm()方法返回false。

语法

confirm(message);

示例

让我们通过下面的示例来理解这个对话框的演示。

<html> 
  
<head>  
    <script type="text/javascript"> 
        function show() { 
            var con = confirm ("It is a Confirm dialog box"); 
            if(con == true) { 
                document.write ("User Want to continue"); 
            }  
            else { 
                document.write ("User does not want to continue"); 
            } 
        } 
    </script> 
</head> 
  
<body> 
    <center> 
        <h1>Hello World :) :)</h1> 
        <h2>Welcome to lidihuo</h2> 
        <p>Click the following button </p> 
        <input type="button" value="Click Me" onclick="show();" /> 
    </center> 
</body> 
  
</html>

输出

成功执行以上代码后，会得到如下输出。

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第3张

当你点击给定的按钮时，你会得到以下输出:

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第4张

点击确定按钮后，会得到:

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第5张

点击取消按钮，你会得到:

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第6张

提示对话框

提示对话框在需要时使用弹出一个文本框来获取用户输入。因此，它可以与用户进行交互。

提示对话框也有两个按钮，分别是确定和取消。用户需要在文本框中提供输入，然后单击确定。当用户单击"确定"按钮时，对话框会读取该值并将其返回给用户。但是点击取消按钮后，prompt()方法返回null。

语法

prompt(message, default_string);

让我们通过下图来理解提示对话框。

示例

<html> 
  
<head>  
    <script type="text/javascript"> 
        function show() { 
            var value = prompt("Enter your Name : ", "Enter your name"); 
            document.write("Your Name is : " + value); 
        } 
    </script> 
</head> 
  
<body> 
    <center> 
        <h1>Hello World :) :)</h1> 
        <h2>Welcome to lidihuo</h2> 
        <p>Click the following button </p> 
        <input type="button" value="Click Me" onclick="show();" /> 
    </center> 
</body> 
  
</html>

输出

执行上述代码成功后，会得到如下输出。

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第7张

当您单击单击我按钮时，您将获得以下输出:

ES6 对话框_https://bianchenghao6.com_【ES6 教程】_第8张

输入你的名字并点击确定按钮，你会得到:

ES6 字符串

ES6 对象