JS创建对话框 – JavaScript教程-srcmini

上一章JavaScript教程请查看：JS窗口导航器navigator

在本教程中，你将学习如何在JavaScript中创建对话框。

创建对话框

在JavaScript中，你可以创建对话框或弹出窗口来与用户交互。你可以使用它们来通知用户，或者在继续之前接收某种用户输入。

你可以创建三种不同类型的对话框警告框、确认框和提示框（alert, confirm和prompt）。

这些对话框的外观是由操作系统和/或浏览器设置决定的，它们不能用CSS修改。对话框也是模态窗口；当显示一个对话框时，代码执行停止，只有在它被取消后才继续。

在下一节中，我们将详细讨论这些对话框。

警报对话框是最简单的对话框，它允许你向用户显示一条短消息，它还包括OK按钮，用户必须单击这个OK按钮才能继续。

你可以使用alert()方法创建警报对话框，在前几章中，你已经看到了许多警告示例。让我们再看一个例子:

var message = "点击OK继续.";
alert(message);
 
/* 下面的代码直到你取消之前的警报才会执行 */
alert("另一个alert.");

确认对话框允许用户确认或取消操作。确认对话框看起来类似于警报对话框，但它包含一个取消按钮和OK按钮。

你可以使用confirm()方法创建确认对话框，此方法仅返回一个布尔值(true或false)，具体取决于用户单击OK或Cancel按钮，这就是为什么在使用它时，它的结果常常被分配给一个变量。

下面的示例将根据单击的按钮在浏览器中打印一些文本。

var result = confirm("你确定吗?");
 
if(result) {
    document.write("点击OK按钮!");
} else {
    document.write("点击取消按钮!");
}

提示对话框用于提示用户输入信息，提示对话框包含一个文本输入字段、一个OK和一个Cancel按钮。

可以使用prompt()方法创建提示对话框。此方法在用户单击OK按钮时返回输入字段中输入的文本，如果用户单击Cancel按钮则返回null。如果用户单击OK按钮而不输入任何文本，则返回一个空字符串。由于这个原因，在使用它时，它的结果通常被分配给一个变量。

下面的示例将打印你在单击OK按钮时输入的值。

var name = prompt("你叫什么名字?");
 
if(name.length > 0 && name != "null") {
    document.write("Hola, " + name);
} else {
    document.write("匿名者!");
}

prompt()方法返回的值总是字符串，这意味着如果用户在输入字段中输入10，将返回字符串“10”，而不是数字10。

因此，如果你想使用返回的值作为一个数字，你必须转换它或强制转换为number，就像这样：var age = number (prompt(“你几岁啦?”));