提起JS弹框,我首先想到的是Alert,然后想到的还是Alert,最后我竟然就只知道Alert。然后面试就死在这个Alert上了。恼火。

根据网上各位大神的总结,我整理了一下,也顺便学习了一下。

一.仅确定,对话框上面只有一个确认按钮我们用Alert()

代码:

<title>Alert弹出确定框</title>
<script type="text/javascript" language="javascript">
alert("Hello Alex");
alert("Bye!");
</script>

运行效果:

点击确定之后。

总结:

1.JavaScript中。每个Alert都会弹出一个对话框,不覆盖。

2.对话框是由浏览器产生的,JavaScript只是触发。不同的浏览器会显示不同的效果

二,确定和取消两个按钮,我们confirm()

代码:

<title>confirm弹出确认取消按钮</title>
<script type="text/javascript" language="javascript">
var isRes = confirm("Alex你在用confirm实现弹框吗?")
if (isRes)
alert("是的,我正在学习如何用confirm实现确认取消框。");
else
alert("没有阿,我没有用confirm实现弹框呢");
</script>

运行效果:

当我点击确定之后:

当我点击取消之后:

总结:

无论我们点击确定还是取消,弹出框都会关闭,不同的是我们点击确定,confirm()返回true,否则返回false。

三,界面显示文本框,用户可输入,用prompt()

代码:

<title>prompt弹出输入框</title>
<script type="text/javascript" language="javascript">
var name = prompt("请输入您的名字:", "");
alert(name);
</script>

运行效果:

点击确定按钮

点击取消按钮

总结:prompt函数有两个参数,第一个参数是要显示消息对话框中的文本,不可修改。第二个参数是文本框中的内容,可以修改。

JavaScript实现弹框的更多相关文章

  1. javascript的弹框

    学习js最先了解到的两种种简单测试手段就是alert("blah");和console.log("blah");了. 除了alert之外,js还有两种弹框 co ...

  2. JavaScript 图片弹框显示

    function fnCreate(src) {             /* 要创建的div的classname */             var ClassName = "thumb ...

  3. Android原生代码拦截H5 Web页面中JavaScript弹窗/弹框

    <html> <body> <script> function showAlert(){ alert("JavaScript - hello , worl ...

  4. javascript flash 弹框

    1. [代码]FlashBox     // JavaScript Documentfunction FlashBox(src,width,height){var docbody = document ...

  5. javascript中的弹框

    大家都见过某度中的恶意广告,你关闭了又出来了!为何,JS来告诉你 效果猛戳此处 HTML <body> <h3 class="whiteColor">无法关 ...

  6. JavaScript插件——弹出框

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

  7. javascript只弹出一次框 再次刷新不弹出

    .打开页面自动弹出  当关闭弹框的时候  设置cookie生存时间  再次刷新页面判断cookie是否失效 <html> <head> <meta charset=&qu ...

  8. JavaScript实现自定义alert弹框

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAh0AAAFkCAYAAACEpYlzAAAfj0lEQVR4nO3dC5BddZ0n8F93pxOQCO

  9. 操作JavaScript的Alert弹框

    @Testpublic void testHandleAlert(){ WebElement button =driver.findElement(By.xpath("input" ...

随机推荐

  1. Unity网络斗地主 服务端

    Unity网络斗地主  服务端 @by梦想之家2工作室 阿龙 已经做好了服务器框架,并且能实现服务器给客户端分牌的问题!

  2. DELL 720XD和R820玩赏

  3. PhpStorm常用快捷键大全

    常用快捷键(keymaps:Default情况下)注意:部分快捷键,必须在没有更改快捷键的情况下才可以使用 功能键Esc键 返回编辑器窗口F1 打开在线帮助F2 (Shift+F2) 下/上高亮错误或 ...

  4. java dump

    注意,请不要被我误导,我没有看其他资料,这是我自己分析的,有些可能是不对的 "DestroyJavaVM" prio=6 tid=0x00316800 nid=0x448 wait ...

  5. ubuntu下新建VPN连接

    1. 安装VPN Client#sudo apt-get install pptp-linux2. 安装网络管理器对VPN的支持#sudo apt-get install network-manage ...

  6. CodeForce 7 B - Memory Manager(模拟)

    题目大意:给你一段内存,要你进行如下的三个操作. 1.分配内存  alloc   X ,分配连续一段长度为X的内存. 如果内存不够应该输出NULL,如果内存够就给这段内存标记一个编号. 2.擦除编号为 ...

  7. POJ 2594 Treasure Exploration(带交叉路的最小路径覆盖)

    题意:  派机器人去火星寻宝,给出一个无环的有向图,机器人可以降落在任何一个点上,再沿着路去其他点探索,我们的任务是计算至少派多少机器人就可以访问到所有的点.有的点可以重复去. 输入数据: 首先是n和 ...

  8. HDU4003 Find Metal Mineral

    看别人思路的 树形分组背包. 题意:给出结点数n,起点s,机器人数k,然后n-1行给出相互连接的两个点,还有这条路线的价值,要求最小花费 思路:这是我从别人博客里找到的解释,因为很详细就引用了 dp[ ...

  9. UVa 11796 计算几何

    题目链接:http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&page=show_problem& ...

  10. Eucalyptus安装包的功能列表

    aoetools    是一个用来在以太网上运行 ATA 存储协议的软件,相当于一个网络存储功能.euca2ools  eucalpytus客户端杜昂管理工具axis2c       SOAP引擎,同 ...