浅谈javascript alert和confirm的美化


Posted in Javascript onDecember 15, 2016

--前言--

window对象的alert和confirm标准方法在不同浏览器的显示效果不太相同,有个相同点是都不是很美观。我们的想法是使用js和css分别仿照它们,提供另一套函数,使在不同浏览器的有着相同的体验效果。

 --设计思路--

为了保留原有的alert和confirm方法,我们不直接替换window对象的alert和confirm,而是新建一个win对象,该对象下有alert、confirm、open、close等。win.alert等的对话框弹出层,使用iframe作底层,确保对话框在ie7以下版本时也能把select标签覆盖在底下,这些对话框在弹出之后,是不会阻塞脚本运行的,所以win.alert等函数都提供一个回调参数,在对话框关闭或选择之后触发这个回调参数,函数原型如下:

win.alert = function (title, message, closed) { ...} // alert
win.confirm = function (title, message, selected) {...} // confirm
win.open = function (width, height, title, url, closed) {...} // 弹出页面对话框

--成果展示--

浅谈javascript alert和confirm的美化

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
JavaScript学习点滴 call、apply的区别
Oct 22 Javascript
基于jquery的跨域调用文件
Nov 19 Javascript
js 替换功能函数,用正则表达式解决,js的全部替换
Dec 08 Javascript
jQuery弹性滑动导航菜单实现思路及代码
May 02 Javascript
简述Jquery与DOM对象
Jul 10 Javascript
js实现图片轮播效果
Dec 19 Javascript
详解angular中如何监控dom渲染完毕
Jan 03 Javascript
Bootstrap DateTime Picker日历控件简单应用
Mar 25 Javascript
浅谈 vue 中的 watcher
Dec 04 Javascript
vuejs使用axios异步访问时用get和post的实例讲解
Aug 09 Javascript
vue读取本地的excel文件并显示在网页上方法示例
May 29 Javascript
小程序采集录音并上传到后台
Nov 22 Javascript
JavaScript模板引擎Template.js使用详解
Dec 15 #Javascript
原生JS实现图片轮播切换效果
Dec 15 #Javascript
javascript中数组(Array)对象和字符串(String)对象的常用方法总结
Dec 15 #Javascript
利用vue写todolist单页应用
Dec 15 #Javascript
jquery插件bootstrapValidator表单验证详解
Dec 15 #Javascript
jQuery中的100个技巧汇总
Dec 15 #Javascript
JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)
Dec 14 #Javascript
You might like
php遍历文件夹所有文件子文件夹函数代码
2013/11/27 PHP
标准PHP的AES加密算法类
2015/03/12 PHP
php 变量引用与变量销毁机制详细介绍
2016/12/05 PHP
php实现XML和数组的相互转化功能示例
2017/02/08 PHP
Laravel 5.5基于内置的Auth模块实现前后台登陆详解
2017/12/21 PHP
laravel 数据迁移与 Eloquent ORM的实现方法
2019/04/12 PHP
jQuery表单美化插件jqTransform使用详解
2015/04/12 Javascript
快速学习jQuery插件 jquery.validate.js表单验证插件使用方法
2015/12/01 Javascript
javascript创建对象的几种模式介绍
2016/05/06 Javascript
JS实现图片高斯模糊切换效果的焦点图实例
2017/01/21 Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
2018/08/03 jQuery
详解微信小程序canvas圆角矩形的绘制的方法
2018/08/22 Javascript
JavaScript设计模式之命令模式实例分析
2019/01/16 Javascript
jQuery 隐藏/显示效果函数用法实例分析
2020/05/20 jQuery
解决vue-router 嵌套路由没反应的问题
2020/09/22 Javascript
[42:25]2018DOTA2亚洲邀请赛 4.5 淘汰赛 LGD vs Liquid 第三场
2018/04/06 DOTA
[44:40]Spirit vs Navi Supermajor小组赛 A组败者组第一轮 BO3 第一场 6.2
2018/06/03 DOTA
Python中optparse模块使用浅析
2015/01/01 Python
python skimage 连通性区域检测方法
2018/06/21 Python
python hash每次调用结果不同的原因
2019/11/21 Python
Python类继承和多态原理解析
2020/02/05 Python
如何基于python3和Vue实现AES数据加密
2020/03/27 Python
浅谈Pycharm的项目文件名是红色的原因及解决方式
2020/06/01 Python
Python 中如何写注释
2020/08/28 Python
python palywright库基本使用
2021/01/21 Python
CSS3图片旋转特效(360/60/-360度)
2013/10/10 HTML / CSS
美国豪华时尚女性精品店:Kirna Zabête
2018/01/11 全球购物
加拿大时尚潮流大码女装购物网站:Addition Elle
2018/04/02 全球购物
英国羊皮鞋类领先品牌:Just Sheepskin
2019/12/12 全球购物
美国在线和移动免费会员制批发零售商:Boxed(移动端的Costco)
2020/01/02 全球购物
英国100%防污和防水的靴子:Muck Boot Company
2020/09/08 全球购物
PHP中如何使用Cookie
2015/10/28 面试题
银行实习人员自我鉴定
2013/09/22 职场文书
项目经理的岗位职责
2013/11/23 职场文书
学习雷锋精神演讲稿
2014/05/10 职场文书
小学生节水倡议书
2015/04/29 职场文书