浅谈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 设置某DIV区域内的checkbox复选框
Nov 30 Javascript
Javascript 自适应高度的Tab选项卡
Apr 05 Javascript
JQuery加载图片自适应固定大小的DIV
Sep 12 Javascript
使用 Node.js 做 Function Test实现方法
Oct 25 Javascript
Javascript基础教程之比较操作符
Jan 18 Javascript
js实现多选项切换导航菜单的方法
Feb 06 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
jquery实现的回旋滚动效果完整实例【附demo源码下载】
Sep 20 Javascript
详解Vue.js之视图和数据的双向绑定(v-model)
Jun 23 Javascript
关于自定义Egg.js的请求级别日志详解
Dec 12 Javascript
详解VUE单页应用骨架屏方案
Jan 17 Javascript
利用Webpack实现小程序多项目管理的方法
Feb 25 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
附件名前加网站名
2008/03/23 PHP
php中单个数据库字段多列显示(单字段分页、横向输出)
2014/07/28 PHP
javascript 自动转到命名锚记
2009/01/10 Javascript
jquery tools 系列 scrollable(2)
2009/09/06 Javascript
Jquery 表单取值赋值的一些基本操作
2009/10/11 Javascript
使用PHP+JQuery+Ajax分页的实现
2013/04/23 Javascript
javascript中encodeURI和decodeURI方法使用介绍
2013/05/06 Javascript
jquery获取URL中参数解决中文乱码问题的两种方法
2013/12/18 Javascript
easyui datagrid 键盘上下控制选中行示例
2014/03/31 Javascript
jQuery实现带动画效果的二级下拉导航方法
2015/03/11 Javascript
Nodejs爬虫进阶教程之异步并发控制
2016/02/15 NodeJs
js字符串截取函数slice、substring和substr的比较
2016/05/17 Javascript
JS触发服务器控件的单击事件(详解)
2016/08/06 Javascript
JavaScript中闭包之浅析解读(必看篇)
2016/08/25 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
2017/09/13 Javascript
JavaScript this使用方法图解
2020/02/04 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
2020/09/16 Javascript
vue编写简单的购物车功能
2021/01/08 Vue.js
[02:25]DOTA2英雄基础教程 虚空假面
2014/01/02 DOTA
解密Python中的描述符(descriptor)
2015/06/03 Python
Python中使用OpenCV库来进行简单的气象学遥感影像计算
2016/02/19 Python
python中解析json格式文件的方法示例
2017/05/03 Python
python设置中文界面实例方法
2020/10/27 Python
关于python3.9安装wordcloud出错的问题及解决办法
2020/11/02 Python
python实现双人五子棋(终端版)
2020/12/30 Python
如何用Python徒手写线性回归
2021/01/25 Python
国际礼品店:GiftsnIdeas
2018/05/03 全球购物
环境科学专业个人求职信
2013/09/26 职场文书
财务工作者先进事迹材料
2014/01/17 职场文书
《母鸡》教学反思
2014/02/25 职场文书
学徒工职责
2014/03/06 职场文书
2014年信访工作总结
2014/11/17 职场文书
go语言中http超时引发的事故解决
2021/06/02 Golang
Java实现简易的分词器功能
2021/06/15 Java/Android
「我的青春恋爱物语果然有问题。-妄言录-」第20卷封面公开
2022/03/21 日漫
SQL中去除重复数据的几种方法汇总(窗口函数对数据去重)
2023/05/08 MySQL