JavaScript 弹出框
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 弹出框的更多相关文章
- 练习:javascript弹出框及地址选择功能,可拖拽
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- javascript弹出框打印某个数值时,弹出NaN?(not a number)
一.NaN:表示not a number null 未定义或空字符串 undefined 对象属性不存在 或是声明了变量但从未赋值. 二.出现这种情况有(1)此常数的值是零被零除所得到的结果. (2) ...
- JavaScript弹出框
confirm(str); 参数说明: str:在消息对话框中要显示的文本 返回值: Boolean值 返回值: 当用户点击"确定"按钮时,返回true 当用户点击"取消 ...
- JavaScript 弹出框:警告(alert)、确认(confirm)的简单写法
onclick="javascript:return window.confirm('message')"
- Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例
弹出框是网页自动化测试常见得操作页面元素之一,常见的JavaScript弹出框有如下三种: 1.alert(message):方法用于显示带有一条指定消息和一个 OK 按钮的警告框.DemoAlert ...
- 转:WebDriver(Selenium2) 处理可能存在的JS弹出框
在自动化测试过程中,有些情况下我们会遇到一些潜在的Javascript弹出框.(即某些条件下才会出现,不是固定出现),然后如果当这种弹出框出现,我们没有加以处理,WebDriver将无法进行下一步的操 ...
- WebDriver(Selenium2) 处理可能存在的JS弹出框
http://uniquepig.iteye.com/blog/1703103 在自动化测试过程中,有些情况下我们会遇到一些潜在的Javascript弹出框.(即某些条件下才会出现,不是固定出现),然 ...
- 四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现
原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...
- JavaScript插件——弹出框
(JavaScript插件——弹出框) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.htm ...
随机推荐
- 莫烦TensorFlow_08 tensorboard可视化进阶
import tensorflow as tf import numpy as np import matplotlib.pyplot as plt # # add layer # def add_l ...
- Linux下Maven安装(十二)
一.前提条件 下载并安装好JDK .在终端输入命令“java -version”,如果出现类似如下信息说明JDK安装成功. 二.开始配置Maven 1. 下载maven:http://mirror.b ...
- Springboot 项目中 xml文件读取yml 配置文件
<bean id="yamlProperties" class="org.springframework.beans.factory.config.YamlProp ...
- html--前端jquery初识
一.把 jQuery 添加到您的网页如需使用 jQuery,需要下载 jQuery 库,然后把它包含在希望使用的网页中.jQuery 库是一个 JavaScript 文件,您可以使用 HTML 的 & ...
- 遵循PEP8风格
遵循PEP8风格 在编写python代码的时候我们应该采用统一的风格来编写代码,可以使代码更加容易读懂.采用和其他程序员统一的编码风格来写代码,也可以使项目更利于多人协作开发.即便代码只有你自己能看懂 ...
- [LeetCode] 899. Orderly Queue 有序队列
A string S of lowercase letters is given. Then, we may make any number of moves. In each move, we c ...
- [LeetCode] 785. Is Graph Bipartite? 是二分图么?
Given an undirected graph, return true if and only if it is bipartite. Recall that a graph is bipart ...
- Salesforce 开发新工具 - Visual Studio Code
最近尝试使用Visual Studio Code来做Salesforce的开发工具,体验上比Sublime好用不少,介绍下详细步骤 第一步:下载对应版本的Visual Studio Code 下载地址 ...
- 第20课 unique_ptr独占型智能指针
一. unique_ptr的基本用法 (一)初始化方式 1. 直接初始化:unique<T> myPtr(new T); //ok.但不能通过隐式转换来构造,如unique<T&g ...
- PHP获取cookie、Token、模拟登录、抓取数据、解析生成json
本文介绍使用PHP获取cookie,获取Token.以及模拟登录.然后抓取数据.最后解析生成json的的过程. 0. 设置Cookie路径 set_time_limit(0); //使用的cookie ...