本文详细介绍 JavaScript 中三种常用的消息框:alert 用于显示提示,confirm 用于确认操作,prompt 用于获取用户输入。通过完整的 HTML 与 JS 代码示例,展示如何创建触发按钮并处理不同弹窗的交互逻辑,帮助开发者快速掌握前端基础交互功能。
JavaScript 消息框运行效果
首先展示一下这三种消息框的实际运行效果。



完整代码实现
接下来提供完整的实现代码供参考。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function warn_info(){
alert("提示消息框");
}
function sure_info(){
if (confirm("确认删除吗?")){
alert("删除成功");
}
else{
alert("取消删除");
}
}
function input_info(){
var txt=prompt("请输入您的年龄");
if(txt==""){
alert("输入为空,重新输入");
}
else{
alert("您的年龄为"+txt)
}
}
</script>
</head>
<body>
<input type="button" value="提示消息" onclick="warn_info()">
<input type="button" value="确认消息" onclick="sure_info()">
<input type="button" value="输入消息" onclick="input_info()">
</body>
</html>
总结
以上就是关于 JavaScript 消息框的全部内容,感谢关注。