浅谈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 构造函数,公有,私有特权和静态成员定义方法
Nov 30 Javascript
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
Dec 26 Javascript
基于jquery的固定表头和列头的代码
May 03 Javascript
iphone safari不支持position fixed的解决方法
May 04 Javascript
jquery实现智能感知连接外网搜索
May 21 Javascript
CSS+jQuery实现的一个放大缩小动画效果
Sep 24 Javascript
JS获取计算机mac地址以及IP的实现方法
Jan 08 Javascript
[Bootstrap-插件使用]Jcrop+fileinput组合实现头像上传功能实例代码
Dec 20 Javascript
使用Vuex解决Vue中的身份验证问题
Sep 28 Javascript
jQuery HTML获取内容和属性操作实例分析
May 20 jQuery
JSON 入门教程基础篇 json入门学习笔记
Sep 22 Javascript
微信小程序实现单个或多个倒计时功能
Nov 01 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设计模式 Composite (组合模式)
2011/06/26 PHP
ThinkPHP3.1查询语言详解
2014/06/19 PHP
基于jQuery的的一个隔行变色,鼠标移动变色的小插件
2010/07/06 Javascript
原生javascript实现图片轮播效果代码
2010/09/03 Javascript
Jquery阻止事件冒泡 event.stopPropagation
2011/12/11 Javascript
jQuery cdn使用介绍
2013/05/08 Javascript
js css后面所带参数含义介绍
2013/08/18 Javascript
js实现网页随机切换背景图片的方法
2014/11/01 Javascript
javascript结合Canvas 实现简易的圆形时钟
2015/03/11 Javascript
jQuery的Scrollify插件实现滑动到页面下一节点
2015/07/05 Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
2015/07/06 Javascript
JS实现网页顶部向下滑出的全国城市切换导航效果
2015/08/22 Javascript
JavaScript 封装一个tab效果源码分享
2015/09/15 Javascript
基于Jquery插件实现跨域异步上传文件功能
2016/04/26 Javascript
js select下拉联动 更具级联性!
2020/04/17 Javascript
微信小程序日历组件calendar详解及实例
2017/06/08 Javascript
JavaScript学习笔记之惰性函数示例详解
2017/08/27 Javascript
如何给element添加一个抽屉组件的方法步骤
2019/07/14 Javascript
Vue 3.0双向绑定原理的实现方法
2019/10/23 Javascript
VUE解决 v-html不能触发点击事件的问题
2019/10/28 Javascript
JavaScript eval()函数定义及使用方法详解
2020/07/07 Javascript
[32:47]完美世界DOTA2联赛 GXR vs IO 第二场 11.07
2020/11/09 DOTA
Python简易版停车管理系统
2019/08/12 Python
基于Python解密仿射密码
2019/10/21 Python
pip/anaconda修改镜像源,加快python模块安装速度的操作
2021/03/04 Python
html5的canvas实现3d雪花飘舞效果
2013/12/27 HTML / CSS
好药师网上药店:安全合法的网上药品零售药房
2017/02/15 全球购物
Speedo速比涛德国官方网站:世界领先的泳装品牌
2019/08/26 全球购物
党的生日活动方案
2014/08/15 职场文书
党员创先争优心得体会
2014/09/11 职场文书
报表员工作失误检讨书范文
2014/09/19 职场文书
审美与表现自我评价
2015/03/09 职场文书
爱国主义教育主题班会
2015/08/13 职场文书
培训心得体会怎么写
2016/01/25 职场文书
三好学生评选事迹材料(2016精选版)
2016/02/25 职场文书
AJAX实现省市县三级联动效果
2021/10/16 Javascript