博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
更改默认alert框体
阅读量:6813 次
发布时间:2019-06-26

本文共 3158 字,大约阅读时间需要 10 分钟。

更改框体主要用到的是更改系统的内置控件winpop下面是winpop具体代码

(function(window, jQuery, undefined) { 2  3 var HTMLS = { 4 ovl: '
' + '
' + '
' + '
' + '
', 5 alert: '', 6 confirm: '' + '' 7 } 8 9 function Winpop() { 10 var config = {}; 11 this.get = function(n) { 12 return config[n]; 13 } 14 15 this.set = function(n, v) { 16 config[n] = v; 17 } 18 this.init(); 19 } 20 21 Winpop.prototype = { 22 init: function() { 23 this.createDom(); 24 this.bindEvent(); 25 }, 26 createDom: function() { 27 var body = jQuery("body"), 28 ovl = jQuery("#J_WinpopBox"); 29 30 if (ovl.length === 0) { 31 body.append(HTMLS.ovl); 32 } 33 34 this.set("ovl", jQuery("#J_WinpopBox")); 35 this.set("mask", jQuery("#J_WinpopMask")); 36 }, 37 bindEvent: function() { 38 var _this = this, 39 ovl = _this.get("ovl"), 40 mask = _this.get("mask"); 41 ovl.on("click", ".J_AltBtn", function(e) { 42 _this.hide(); 43 }); 44 ovl.on("click", ".J_CfmTrue", function(e) { 45 var cb = _this.get("confirmBack"); 46 _this.hide(); 47 cb && cb(true); 48 }); 49 ovl.on("click", ".J_CfmFalse", function(e) { 50 var cb = _this.get("confirmBack"); 51 _this.hide(); 52 cb && cb(false); 53 }); 54 mask.on("click", function(e) { 55 _this.hide(); 56 }); 57 jQuery(document).on("keyup", function(e) { 58 var kc = e.keyCode, 59 cb = _this.get("confirmBack");; 60 if (kc === 27) { 61 _this.hide(); 62 } else if (kc === 13) { 63 _this.hide(); 64 if (_this.get("type") === "confirm") { 65 cb && cb(true); 66 } 67 } 68 }); 69 }, 70 alert: function(str, btnstr) { 71 var str = typeof str === 'string' ? str : str.toString(), 72 ovl = this.get("ovl"); 73 this.set("type", "alert"); 74 ovl.find(".J_WinpopMain").html(str); 75 if (typeof btnstr == "undefined") { 76 ovl.find(".J_WinpopBtns").html(HTMLS.alert); 77 } else { 78 ovl.find(".J_WinpopBtns").html(btnstr); 79 } 80 this.show(); 81 }, 82 confirm: function(str, callback) { 83 var str = typeof str === 'string' ? str : str.toString(), 84 ovl = this.get("ovl"); 85 this.set("type", "confirm"); 86 ovl.find(".J_WinpopMain").html(str); 87 ovl.find(".J_WinpopBtns").html(HTMLS.confirm); 88 this.set("confirmBack", (callback || function() {})); 89 this.show(); 90 }, 91 show: function() { 92 this.get("ovl").show(); 93 this.get("mask").show(); 94 }, 95 hide: function() { 96 var ovl = this.get("ovl"); 97 ovl.find(".J_WinpopMain").html(""); 98 ovl.find(".J_WinpopBtns").html(""); 99 ovl.hide();100 this.get("mask").hide();101 },102 destory: function() {103 this.get("ovl").remove();104 this.get("mask").remove();105 delete window.alert;106 delete window.confirm;107 }108 };109 110 var obj = new Winpop();111 window.alert = function(str) {112 obj.alert.call(obj, str);113 };114 window.confirm = function(str, cb) {115 obj.confirm.call(obj, str, cb);116 };117 })(window, jQuery);

然后实例化对象

1 var obj = new Winpop(); // 创建一个Winpop的实例对象2 // 覆盖alert控件3 window.alert = function(str) {4 obj.alert.call(obj, str);5 };6 // 覆盖confirm控件7 window.confirm = function(str, cb) {8 obj.confirm.call(obj, str, cb);9 }; 以下JS不可少

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

<script src="winpop.js"></script>

转载:http://www.cnblogs.com/zqzjs/p/4417453.html

你可能感兴趣的文章
在线面试, 前端, 提纲, 草稿
查看>>
hive_异常_01_ Terminal initialization failed; falling back to unsupported
查看>>
分布式事务键值数据库 TiKV 加入 CNCF 沙箱孵化器
查看>>
Vue - day1
查看>>
kvm.virsh常用命令篇
查看>>
[Hive]Hive使用指南四 客户端导入数据
查看>>
10.JUC线程高级-线程八锁
查看>>
Apache Flink轻量级异步快照机制源码分析
查看>>
PostgreSQL 11 preview - 分区表 增强 汇总
查看>>
MediaCodec在Android视频硬解码组件的应用
查看>>
用JAVA自己画一张二维码
查看>>
Flutter Engine线程管理与Dart Isolate机制
查看>>
美国泛达公司:下一代数据中心的光缆布线系统
查看>>
以太坊(ethereum)技术开发相关资料
查看>>
Pandas数据排序
查看>>
gulp常用插件
查看>>
2018 前端趋势:更一致,更简单
查看>>
SQL物化视图 自动更新 定时刷新
查看>>
express框架应用接入阿里云函数计算
查看>>
几行代码实现ofo首页小黄人眼睛加速感应转动
查看>>