一、js三种消息框总结-警告框、确认框、提示框

我们在访问网站的时候，有时会突然弹出一个小窗口，上面写着一段提示信息文字。如果你不点击“确定”，就不能对网页做任何操作，这个小窗口就是使用alert实现的。

注:alert弹出消息对话框(包含一个确定按钮)。

语法:

alert(字符串或变量);

注意:

1. 在点击对话框"确定"按钮前，不能进行任何其它操作。

2. 消息对话框通常可以用于调试程序。

3. alert输出内容，可以是字符串或变量，与document.write 相似。

<title>alert</title>
  <script type="text/javascript"> function rec(){ var mychar="I love JavaScript"; alert(mychar); } </script>
<head></head>
<body>
    <input name="button" type="button" onClick="rec()" value="点击我，弹出对话框" />
</body>

确认（confirm 消息对话框）

confirm 消息对话框通常用于允许用户做选择的动作，如：“你对吗？”等。弹出对话框(包括一个确定按钮和一个取消按钮)。

语法:

confirm(str);

参数说明:

str：在消息对话框中要显示的文本
返回值: Boolean值

返回值:

当用户点击"确定"按钮时，返回true
当用户点击"取消"按钮时，返回false

注: 通过返回值可以判断用户点击了什么按钮

<script type=“text/javascript”> function rec() { var mymessage=confirm(“你喜欢javascript吗？”); if(mymessage==true) { document.write(“很好，加油！”); } else if(mymessage==false) { document.write(“要学javascript，而且必须学”); } } </script>
	
<head></head>
 
<body>
	<input type=“button” name=“button” value=“点击我，弹出确认对话框” onclick=“rec()” />
</body>

<script type=“text/javascript”> function resc() { var myname=prompt(“请输入你的姓名”); if(myname!=null) { document.write(“你好”+myname); } else { document.write(“你好”+朋友); } } </script>

<head></head>

<body>
	<input type=“button” name=“button” value=“点击我，弹出提问对话框” onclick=“resc()” />
</body>

二、js中prompt()的用法

alert() 弹出个提示框（确定）
confirm() 弹出个确认框（确定，取消）
prompt() 弹出个输入框让你输入东西

使用消息框
使用警告、提示和确认
可以使用警告、确认和提示消息框来获得用户的输入。这些消息框是 window 对象的接口方法。由于 window 对象位于对象层次的顶层，因此实际应用中不必使用这些消息框的全名（例如 "window.alert()"），不过采用全名是一个好注意，这样有助于您记住这些消息框属于哪个对象。

警告消息框
alert 方法有一个参数，即希望对用户显示的文本字符串。该字符串不是 HTML 格式。该消息框提供了一个“确定”按钮让用户关闭该消息框，并且该消息框是模式对话框，也就是说，用户必须先关闭该消息框然后才能继续进行操作。

window.alert("欢迎！请按“确定”继续。");
确认消息框
使用确认消息框可向用户问一个“是-或-否”问题，并且用户可以选择单击“确定”按钮或者单击“取消”按钮。confirm 方法的返回值为 true 或 false。该消息框也是模式对话框：用户必须在响应该对话框（单击一个按钮）将其关闭后，才能进行下一步操作。

var truthBeTold = window.confirm("单击“确定”继续。单击“取消”停止。");
if (truthBeTold) {
window.alert("欢迎访问我们的 Web 页！");
} else window.alert("再见啦！");
提示消息框
提示消息框提供了一个文本字段，用户可以在此字段输入一个答案来响应您的提示。该消息框有一个“确定”按钮和一个“取消”按钮。如果您提供了一个辅助字符串参数，则提示消息框将在文本字段显示该辅助字符串作为默认响应。否则，默认文本为 "<undefined>"。

与alert( ) 和 confirm( ) 方法类似，prompt 方法也将显示一个模式消息框。用户在继续操作之前必须先关闭该消息框

var theResponse = window.prompt("欢迎？","请在此输入您的姓名。");

window.confirm 参数就只有一个.显示提示框的信息.
按确定,返回true; 按取消返回false.

<script>
var bln = window.confirm("确定吗?");
alert(bln)
</script>

window.alert参数,只有一个,显示警告框的信息;
无返回值.

<script>
window.alert("确定.")
</script>

window.prompt参数,有两个,
第一个参数,显示提示输入框的信息.
第二个参数,用于显示输入框的默认值.
返回,用户输入的值.

<script>
var str = window.prompt("请输入密码","password")
alert(str);
</script>

<html>

<head>

</head>
<script language="javascript" type="text/javascript">
    var yanzhengma = window.prompt("输入验证码", "")
    if( yanzhengma == 123 )
    {
        alert("ok");
    }
    else
    {
        alert("false");
    }
</script>
<body>

</body>

</html>

三、window.prompt的确定和取消事件

在使用window.prompt弹窗时，怎么判断用户是否输入内容？又怎么区分用户不输入内容的情况下点击的是“确定”还是“取消”？

var reason = window.prompt(“请输入审核不通过理由：”, “”);

//1. 单纯判断用户是否填写“审核不通过理由”： 
if(reason){ 
//用户填写了理由 
}else{ 
//用户没有填写理由 
}

//2. 要区分用户不输入内容点击的是“确定”还是“取消”： 
if(reason){ 
alert(reason);//显示输入内容
//用户填写了内容并且点击的是“确定” 
}else if(reason === “”){ 
//用户没有输入内容点击的“确定” 
}else{ 
//点击的是“取消” 
}

window.prompt点击“确定”返回输入框中的值，不输入内容点击“确定”返回的是“”（前提是你在prompt时要加一个默认的”“返回值，参考上面代码），点击“取消”返回的是null。

js三种消息框总结-警告框、确认框、提示框

一、js三种消息框总结-警告框、确认框、提示框

确认（confirm 消息对话框）

二、js中prompt()的用法

三、window.prompt的确定和取消事件

参考：