JavaScript 有三种类型的弹出框：警告框、确认框和提示框。

警告框

如果要确保信息传递给用户，通常会使用警告框。

当警告框弹出时，用户将需要单击“确定”来继续。

语法

window.alert("sometext");

window.alert() 方法可以不带 window 前缀来写。

实例

alert("我是一个警告框！");

完整实例

<!DOCTYPE html>

<html>

<body>

<h1>JavaScript 警告框</h1>

<button onclick="myFunction()">试一试</button>

<script>

function myFunction() {

  alert("我是一个警告框！");

}

</script>

</body>

</html>

确认框

如果您希望用户验证或接受某个东西，则通常使用“确认”框。

当确认框弹出时，用户将不得不单击“确定”或“取消”来继续进行。

如果用户单击“确定”，该框返回 true。如果用户单击“取消”，该框返回 false。

语法

window.confirm("sometext");

window.confirm() 方法可以不带 window 前缀来编写。

实例

var r = confirm("请按按钮");

if (r == true) {

    x = "您按了确认！";

} else {

    x = "您按了取消！";

}

完整实例

<!DOCTYPE html>

<html>

<body>

<h1>JavaScript 确认框</h1>

<button onclick="myFunction()">试一试</button>

<p id="demo"></p>

<script>

function myFunction() {

  var txt;

  if (confirm("Press a button!")) {

    txt = "您按了确定";

  } else {

    txt = "您按了取消";

  }

  document.getElementById("demo").innerHTML = txt;

}

</script>

</body>

</html>

提示框

如果您希望用户在进入页面前输入值，通常会使用提示框。

当提示框弹出时，用户将不得不输入值后单击“确定”或点击“取消”来继续进行。

如果用户单击“确定”，该框返回输入值。如果用户单击“取消”，该框返回 NULL。

语法

window.prompt("sometext","defaultText");

window.prompt() 方法可以不带 window 前缀来编写。

实例

var person = prompt("请输入您的姓名", "比尔盖茨");

if (person != null) {

    document.getElementById("demo").innerHTML = "你好 " + person + "！今天过的怎么样？";

}

完整实例

<!DOCTYPE html>

<html>

<body>

<h1>JavaScript Prompt</h1>

<button onclick="myFunction()">试一试</button>

<p id="demo"></p>

<script>

function myFunction() {

  var txt;

  var person = prompt("请输入您的名字：", "哈利波特");

  if (person == null || person == "") {

    txt = "用户取消输入";

  } else {

    txt = "你好，" + person + "！今天过得好吗？";

  }

  document.getElementById("demo").innerHTML = txt;

}

</script>

</body>

</html>

折行

如需在弹出框中显示折行，请在反斜杠后面加一个字符 n。

实例

alert("Hello\nHow are you?");

完整实例

<!DOCTYPE html>

<html>

<body>

<h1>JavaScript</h1>

<p>在警告框中换行。</p>

<button onclick="alert('Hello\nHow are you?')">试一试</button>

</body>

</html>

　　

JavaScript 弹出框的更多相关文章

  1. 练习：javascript弹出框及地址选择功能,可拖拽

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. javascript弹出框打印某个数值时，弹出NaN？（not a number）

    一.NaN:表示not a number null 未定义或空字符串 undefined 对象属性不存在 或是声明了变量但从未赋值. 二.出现这种情况有(1)此常数的值是零被零除所得到的结果. (2) ...

  3. JavaScript弹出框

    confirm(str); 参数说明: str:在消息对话框中要显示的文本 返回值: Boolean值 返回值: 当用户点击"确定"按钮时,返回true 当用户点击"取消 ...

  4. JavaScript 弹出框:警告(alert)、确认(confirm)的简单写法

    onclick="javascript:return window.confirm('message')"

  5. Selenium2学习-040-JavaScript弹出框（alert、confirm、prompt）操作演示实例

    弹出框是网页自动化测试常见得操作页面元素之一,常见的JavaScript弹出框有如下三种: 1.alert(message):方法用于显示带有一条指定消息和一个 OK 按钮的警告框.DemoAlert ...

  6. 转：WebDriver(Selenium2) 处理可能存在的JS弹出框

    在自动化测试过程中,有些情况下我们会遇到一些潜在的Javascript弹出框.(即某些条件下才会出现,不是固定出现),然后如果当这种弹出框出现,我们没有加以处理,WebDriver将无法进行下一步的操 ...

  7. WebDriver(Selenium2) 处理可能存在的JS弹出框

    http://uniquepig.iteye.com/blog/1703103 在自动化测试过程中,有些情况下我们会遇到一些潜在的Javascript弹出框.(即某些条件下才会出现,不是固定出现),然 ...

  8. 四种常见的提示弹出框（success，warning，error，loading）原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  9. JavaScript插件——弹出框

    (JavaScript插件——弹出框) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.htm ...

随机推荐

  1. Dubbo支持的注册中心（二）

    1. Zookeeper 优点:支持网络集群 缺点:稳定性受限于 Zookeeper 2. Redis 优点:对服务器环境要求较高 缺点:对服务器环境要求较高 3. Multicast 优点:去中心化 ...

  2. django之分页器、多对多关系、form校验组件

    批量插入数据 bulk_create # 1.往书籍表中插入数据 1000 # for i in range(1000): # 这种插入方式 效率极低 # models.Book.objects.cr ...

  3. NOIP 2003 乒乓球

    洛谷 P1042 乒乓球 https://www.luogu.org/problemnew/show/P1042 JDOJ 1363: [NOIP2003]乒乓球 T1 https://neooj.c ...

  4. [BZOJ3538]坑爹的GPS

    题目描述 Description 有一天,\(FJ\) 买了一辆车,但是,他一手下载了两个\(GPS\) 系统.好了现在麻烦的事情来了,\(GPS\) 有一个功能大概大家也知道,如果\(FJ\) 没有 ...

  5. 使用async-profiler简单分析zeebe 工作流引擎的性能

    刚开始的时候直接使用的系统暴露的prometheus metrics,发现越高的版本反而性能越差,期间使用过了 perf 打算使用perf 生成火焰图的,但是因为符号缺失,只找到了占用较高的任务,详细 ...

  6. Web协议详解与抓包实战：HTTP1协议-如何传递 IP 地址？（6）

    一.HTTP消息在服务器端的路由 Host 头部 规范与实现间是有差距的 二.代理服务器转发消息时的相关头部 1.Host 头部与消息的路由 2.客户端与源服务器间存在多个代理 三.如何传递 IP 地 ...

  7. 认识map-reduce

    基本概念 map-reduce1.0 例子: hadoop streaming 用语言驱动map-reduce的话,使用的hadoop streaming命令,可以通过python,php,java来 ...

  8. oracle--LGWR

    一,LGWR功能 日志写进程(日志写比数据写更重要),因为内存中的数据一断电就消 失,要做数据的回滚.前滚只能依靠日志文件.log buffer 只是缓冲日志写 二,触发机制 ) 提交命令:commi ...

  9. C# HTTP系列12 以form-data方式上传键值对集合到远程服务器

    系列目录     [已更新最新开发文章,点击查看详细] 使用multipart/form-data方式提交数据与普通的post方式有一定区别.multipart/form-data的请求头必须包含一个 ...

  10. 微信小程序常用样式汇总

    本文系转载: 原文作者:chenzheng8975 原文地址:https://www.cnblogs.com/chenzheng8975/p/9605186.html 微信小程序常用样式汇总 小程序特 ...