<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>对话框的三种使用方法</title>
<script type="text/javascript">
function show_alert(){
<!-- 1. alert() 函数:弹出消息对话框(对话框中有一个OK按钮)消息提示框-->
alert("alert:弹出消息提示框,只有一个OK按钮");
}
function show_confirm(){
<!-- 2. confirm() 函数:弹出消息对话框(对话框中包含一个OK按钮与Cancel按钮)消息确认框 -->
window.confirm("confirm:弹出消息提示框,有一个OK按钮和Cancel(取消)按钮,可以传入内容");
//因为confirm对话框有2种结果:true/false(window.close()方法 火狐不适用,IE可以)
var a = window.confirm("你确定关闭浏览器吗?");
if(a){ //当a为true时,执行下一步
window.close();
}else{ //当a为false时,执行下一步
alert("看我呀!");
}
}
/* 3. prompt() 函数:弹出消息对话框(对话框中包含一个OK按钮、Cancel按钮与一个文本输入框)
两个参数:第一个是文本框的提示信息; 第二个是输入框中的默认信息。使用alert提示prompt框中内容时,点击 确定,显示输入的内容;点击取消,显示null。*/
function show_prompt(){
var b = window.prompt("第一个是文本框的提示信息","第二个是输入框中的默认信息。使用alert提示prompt框中内容时,点击确定,显示输入的内容;点击取消,显示null。");
alert(b);
}
</script>
</head>
<body>
<center>
<button onClick="show_alert()">1. alert对话框</button>
<button onClick="show_confirm()">2. confirm对话框</button>
<button onClick="show_prompt()">3. prompt对话框</button>
</center>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>对话框的三种使用方法</title>
<script type="text/javascript">
function show_alert(){
<!-- 1. alert() 函数:弹出消息对话框(对话框中有一个OK按钮)消息提示框-->
alert("alert:弹出消息提示框,只有一个OK按钮");
}
function show_confirm(){
<!-- 2. confirm() 函数:弹出消息对话框(对话框中包含一个OK按钮与Cancel按钮)消息确认框 -->
window.confirm("confirm:弹出消息提示框,有一个OK按钮和Cancel(取消)按钮,可以传入内容");
//因为confirm对话框有2种结果:true/false(window.close()方法 火狐不适用,IE可以)
var a = window.confirm("你确定关闭浏览器吗?");
if(a){ //当a为true时,执行下一步
window.close();
}else{ //当a为false时,执行下一步
alert("看我呀!");
}
}
/* 3. prompt() 函数:弹出消息对话框(对话框中包含一个OK按钮、Cancel按钮与一个文本输入框)
两个参数:第一个是文本框的提示信息; 第二个是输入框中的默认信息。使用alert提示prompt框中内容时,点击 确定,显示输入的内容;点击取消,显示null。*/
function show_prompt(){
var b = window.prompt("第一个是文本框的提示信息","第二个是输入框中的默认信息。使用alert提示prompt框中内容时,点击确定,显示输入的内容;点击取消,显示null。");
alert(b);
}
</script>
</head>
<body>
<center>
<button onClick="show_alert()">1. alert对话框</button>
<button onClick="show_confirm()">2. confirm对话框</button>
<button onClick="show_prompt()">3. prompt对话框</button>
</center>
</body>
</html>