本文摘自PHP中文网,作者青灯夜游,侵删。
javascript有3个对话框:1、警告框,用于向用户显示警告消息,语法“alert("警告消息");”;2、确认框,语法“confirm("需要确认的信息");”;3、提示框,语法“prompt("提示信息","默认文本");”。
本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。
JavaScript使用3种对话框:警告框,确认框和提示框;分别对应三个函数:alert()、confirm()、prompt()。这些对话框对于使我们的网站看起来更具吸引力非常有帮助。
警告框:alert()
网站中的警告框用于向用户显示警告消息,说明他们输入了错误的值,不是填写该位置所需的值。尽管如此,警报框仍然可以用于更友好的消息。警报框只提供一个按钮“确定”来选择并继续。
示例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< script type = "text/javascript" >
function Warning() {
alert("警告,危险!");
}
</ script >
</ head >
< body >
< p >点击按钮</ p >
< form >
< input type = "button" value = "点击这里" onclick = "Warning();" />
</ form >
</ body >
</ html >
|
效果图:
确认框:confirm()
如果您希望用户验证或接受某些内容,通常使用一个确认框。当确认框弹出时,用户必须单击“确定”或“取消”才能继续。如果用户单击“确定”按钮,window方法confirm()将返回true。如果用户单击“取消”按钮,则confirm()返回false并显示null。
示例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< style >
body,input,p{
font-size: 25px;
}
</ style >
< script type = "text/javascript" >
function Confirmation(){
var Val = confirm("你想继续吗?");
if( Val == true ){
document.write ("继续!");
return true;
}
else{
document.write ("不继续!");
return false;
}
}
</ script >
</ head >
< body >
< p >点击按钮</ p >
< form >
< input type = "button" value = "点击这里" onclick = "Confirmation();" />
</ form >
</ body >
</ html >
|
效果图:
提示框:prompt()
如果希望用户在输入页面之前输入一个值,通常会使用一个提示框。当弹出提示框时,用户必须单击“确定”或“取消”才能继续输入值。如果用户单击“确定”按钮,window方法prompt()将从文本框返回输入的值。如果用户单击“取消”按钮,window方法prompt()将返回null。
例:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <!DOCTYPE html>
< html >
< head >
< meta charset = "utf-8" >
< style >
body,input,p{
font-size: 25px;
}
</ style >
< script type = "text/javascript" >
function Value(){
var Val = prompt("输入你的姓名:", "name");
document.write("你输入的是: " + Val);
}
</ script >
</ head >
< body >
< p >点击按钮</ p >
< form >
< input type = "button" value = "点击这里" onclick = "Value();" />
</ form >
</ body >
</ html >
|
效果图:
更多编程相关知识,请访问:编程视频!!
以上就是javascript有几个对话框的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
js中将一个数转换成相应字符串的函数是什么
详细了解javascript中的回调函数
js如何实现自定义鼠标右击菜单
聊聊javascript里的sleep()方法
两行 javascript 代码生成 uuid的方法
js 什么意思
js如何把html转换成图片格式
bootstrap和react的区别是什么?
javascript如何引用到html中
javascript数组去重有哪几种方式
更多相关阅读请进入《javascript》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » javascript有几个对话框