JS alert()、confirm()、prompt()的区别
这三个都是属于弹框类型的
使用警告、提示和确认消息框来获得用户的输入。这些消息框是 window 对象的接口方法。由于 window
对象位于对象层次的顶层,因此实际应用中不必使用这些消息框的全名(例如 "window.alert()")。
警告消息框
alert 方法有一个参数,即希望对用户显示的文本字符串。该字符串不是 HTML
格式。该消息框提供了一个“确定”按钮让用户关闭该消息框,并且该消息框是模式对话框,也就是说,用户必须先关闭该消息框然后才能继续进行操作。
window.alert("欢迎!请按“确定”继续。");
确认消息框
使用确认消息框可向用户问一个“是-或-否”问题,并且用户可以选择单击“确定”按钮或者单击“取消”按钮。confirm 方法的返回值为
true 或 false。该消息框也是模式对话框:用户必须在响应该对话框(单击一个按钮)将其关闭后,才能进行下一步操作。
<script type="text/javascript">
var truthBeTold = confirm("单击“确定”继续。单击“取消”停止。");
if (truthBeTold = true) {
alert("欢迎访问我们的 Web 页!");
} else {
alert("再见啦!");
} </script>
提示消息框
提示消息框提供了一个文本字段,用户可以在此字段输入一个答案来响应您的提示。该消息框有一个“确定”按钮和一个“取消”按钮。如果您提供了一个辅助字符串参数,则提示消息框将在文本字段显示该辅助字符串作为默认响应。否则,默认文本为
""。
与alert( ) 和 confirm( ) 方法类似,prompt
方法也将显示一个模式消息框。用户在继续操作之前必须先关闭该消息框
<script type="text/javascript">
var iNumber = Number(prompt("输入一个5到100之间的数字", ""));
if (isNaN(iNumber)) //判断输入的是否是数字
document.write("请确认你的输入正确");
else if (iNumber > 100 || iNumber < 5) //判断输入的数字范围
document.write("你输入的数字范围不在5和100之间");
else
document.write("你输入的数字是:" + iNumber); </script> 示例2:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>prompt</title>
<script type="text/javascript">
function rec(){
var score; //score变量,用来存储用户输入的成绩值。
score = prompt("请输入你的成绩","你的成绩为");
if(score>=90)
{
document.write("你很棒!");
}
else if(score>=75)
{
document.write("不错吆!");
}
else if(score>=60)
{
document.write("要加油!");
}
else
{
document.write("要努力了!");
}
}
</script>
</head>
<body>
<input name="button" type="button" onClick="rec()" value="点击我,对成绩做评价!" />
</body>
</html> 综合应用
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">
function openWindow() {
var open = confirm("确认新建窗口打开网站吗?");
if (open == true)
// 新窗口打开时弹出确认框,是否打开
{
var url = prompt("通过输入对话框,确定打开的网址", "http://www.imooc.com");
if (url != null)
// 通过输入对话框,确定打开的网址,默认为 http://www.imooc.com/
{
window.open(url, "_blank", 'width=400px,height=500px,menubar=no,toolbar=no');
}
//打开的窗口要求,宽400像素,高500像素,无菜单栏、无工具栏。
else {
alert("再见!");
}
}
else {
alert("再见!");
}
}
</script>
</head>
<body>
<input type="button" value="新窗口打开网站" onclick="openWindow()"/>
</body>
</html>
JS alert()、confirm()、prompt()的区别的更多相关文章
- selenium python (十一)alert/confirm/prompt的处理(js中的弹出框)
webdriver中处理js所生成的alert.confirm以及prompt,采用switch_to_alert()方法定位到alert/confirm/prompt.然后使用text/accept ...
- Python脚本控制的WebDriver 常用操作 <二十二> 处理alert / confirm / prompt
测试用例场景 webdriver中处理原生的js alert confirm 以及prompt是很简单的.具体思路是使用switch_to.alert()方法定位到alert/confirm/prom ...
- 如何模拟alert/confirm/prompt实现阻断程序运行
场景:在执行js的时候,我们希望运行到某处,进行用户交互,根据交互的内容,运行下面的程序:下面的js程序需要用的和用户交互的内容,所以,和用户交互时,后面的程序必须停止运行 方案: 1. 原生的ale ...
- alert/confirm/prompt 处理
webdriver 中处理JavaScript 所生成的alert.confirm 以及prompt 是很简单的.具体思路是使用switch_to_alert()方法定位到alert/confirm/ ...
- 转:python webdriver API 之alert/confirm/prompt 处理
webdriver 中处理 JavaScript 所生成的 alert.confirm 以及 prompt 是很简单的.具体思路是使用switch_to.alert()方法定位到 alert/conf ...
- Java Selenium - 几种对话框处理Alert\confirm\prompt
1. Alert , 先用常规办法定位到能触发alert的按钮 , 然后 Alert alert = driver.switchTo().alert(); alert.accept(); 如果aler ...
- 2.11 alert\confirm\prompt
2.11 alert\confirm\prompt 前言 不是所有的弹出框都叫alert,在使用alert方法前,先要识别出到底是不是alert.先认清楚alert长什么样子,下次碰到了,就可以用 ...
- Python+Selenium学习--alert/confirm/prompt 处理
场景 webdriver 中处理JavaScript 所生成的alert.confirm 以及prompt 是很简单的.具体思路是使用switch_to.alert()方法定位到alert/confi ...
- 基于js alert confirm样式弹出框
基于js alert confirm样式弹出框.这是一款根据alert confirm优化样式的确认对话框代码. 在线预览 源码下载 实现的代码. html代码: <div id=" ...
- Selenium2学习(十二)-- alert\confirm\prompt
前言 不是所有的弹出框都叫alert,在使用alert方法前,先要识别出到底是不是alert.先认清楚alert长什么样子,下次碰到了,就可以用对应方法解决. alert\confirm\prompt ...
随机推荐
- FIFO队列(First In First Out)和优先队列
queue<类型名> q; q.size() - 返回队列中元素个数 q.empty() - 若队列为空,返回true ,否则返回false q.pop() - 删除队首元素,但不返回其值 ...
- RedHat7.1 安装Oracle12102
选型: 32位的内存是个瓶颈,已经是64位的时代了.使用64位的CentOS6 和 64位的Oracle 11g R2 在虚拟机器安装,采用hostonly方式设置网络 注意:能上网的网卡要设置一下I ...
- 安装sql server
因为电脑中只有mysql数据库,所以昨天准备安装一个sql server.安装中出现了许多问题,首先第一遍的时候,安装组件中没有勾选管理工具这个选项,所以在最后的时候,文件夹中只有配置管理器,没有数据 ...
- java基础 -- Collections.sort的两种用法
/** * @author * @version * 类说明 */ package com.jabberchina.test; import java.util.ArrayList; import j ...
- 使用TFS需要注意的地方
1. 用管理员添加了本地映射,然后用其他用户就添加不了映射,一定要先用管理员账户去把映射 删除掉: 2. 在正式使用TFS时,一定需要在VS工具的设置里面,设置一下,签出时自动获取最新的代码.(默认是 ...
- Qt Qwdget 汽车仪表知识点拆解1 速度表示
先贴上效果图,注意,没有写逻辑,所以这些都是乱动的 这里线主要说一下中间显示速度的显示制作的方式,在这里,自己专门写了一个数字的仪表 考虑的一般的汽车是没有办法把瞬时速度提升到四位数的,所以我这里就放 ...
- 1066 Root of AVL Tree (25 分)(平衡二叉树)
就是AVL的模板题了 注意细节 #include<bits/stdc++.h> using namespace std; typedef struct node; typedef node ...
- eth day05
智能合约众筹实战 淘宝众筹,京东众筹 https://izhongchou.taobao.com/index.htm 分析商业模式 解决京东众筹的痛点 https://izhongchou.taoba ...
- Week1 Team Homework #1 from Z.XML-对于学长项目《shield star》的思考和看法
试用了一下学长黄杨等人开发的<shield star>游戏. 其实作为一个学弟,我对cocos2d-x引擎还算是比较了解,所以对于这样一款很“典型 ...
- UnrealEngine4入门(一) 新建一个c++项目
epic games宣布ue4免费使用(游戏发布之后,每个季度大于3000美元则收取收益的5%)之后,吸引了大批看好VR和AR前景的游戏开发者.不过国内(中文)ue4教程和资料太少,而且一大部分资料都 ...