js重写alert事件(避免alert弹框标题出现网址)


Posted in Javascript onDecember 04, 2020

js代码:

window.alert = function(msg, callback) {
	var div = document.createElement("div");
	div.innerHTML = "<style type=\"text/css\">"
			+ ".nbaMask { position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); }                                          "
			+ ".nbaMaskTransparent { position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0; }                                               "
			+ ".nbaDialog { position: fixed; z-index: 5000; width: 80%; max-width: 300px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: #fff; text-align: center; border-radius: 8px; overflow: hidden; opacity: 1; color: white; }"
			+ ".nbaDialog .nbaDialogHd { padding: .2rem .27rem .08rem .27rem; }                                                       "
			+ ".nbaDialog .nbaDialogHd .nbaDialogTitle { font-size: 17px; font-weight: 400; }                                                   "
			+ ".nbaDialog .nbaDialogBd { padding: 0 .27rem; font-size: 15px; line-height: 1.3; word-wrap: break-word; word-break: break-all; color: #000000; }                                   "
			+ ".nbaDialog .nbaDialogFt { position: relative; line-height: 48px; font-size: 17px; display: -webkit-box; display: -webkit-flex; display: flex; }                                   "
			+ ".nbaDialog .nbaDialogFt:after { content: \" \"; position: absolute; left: 0; top: 0; right: 0; height: 1px; border-top: 1px solid #e6e6e6; color: #e6e6e6; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); }    "
			+ ".nbaDialog .nbaDialogBtn { display: block; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; color: #09BB07; text-decoration: none; -webkit-tap-highlight-color: transparent; position: relative; margin-bottom: 0; }                  "
			+ ".nbaDialog .nbaDialogBtn:after { content: \" \"; position: absolute; left: 0; top: 0; width: 1px; bottom: 0; border-left: 1px solid #e6e6e6; color: #e6e6e6; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleX(0.5); transform: scaleX(0.5); }    "
			+ ".nbaDialog a { text-decoration: none; -webkit-tap-highlight-color: transparent; }"
			+ "</style>"
			+ "<div id=\"dialogs2\" style=\"display: none\">"
			+ "<div class=\"nbaMask\"></div>"
			+ "<div class=\"nbaDialog\">"
			+ "	<div class=\"nbaDialogHd\">"
			+ "		<strong class=\"nbaDialogTitle\"></strong>"
			+ "	</div>"
			+ "	<div class=\"nbaDialogBd\" id=\"dialog_msg2\">弹窗内容,告知当前状态、信息和解决方法,描述文字尽量控制在三行内</div>"
			+ "	<div class=\"nbaDialogHd\">"
			+ "		<strong class=\"nbaDialogTitle\"></strong>"
			+ "	</div>"
			+ "	<div class=\"nbaDialogFt\">"
			+ "		<a href=\"javascript:;\" class=\"nbaDialogBtn nbaDialogBtnPrimary\" id=\"dialog_ok2\">确定</a>"
			+ "	</div></div></div>";
	document.body.appendChild(div);
 
	var dialogs2 = document.getElementById("dialogs2");
	dialogs2.style.display = 'block';
 
	var dialog_msg2 = document.getElementById("dialog_msg2");
	dialog_msg2.innerHTML = msg;
 
	// var dialog_cancel = document.getElementById("dialog_cancel");
	// dialog_cancel.onclick = function() {
	// dialogs2.style.display = 'none';
	// };
	var dialog_ok2 = document.getElementById("dialog_ok2");
	dialog_ok2.onclick = function() {
		dialogs2.style.display = 'none';
		callback();
	};
};

html引用:

<!DOCTYPE html>
<html>
<head>
<title>alert.html</title>
<meta charset="UTF-8">
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="this is my page">
<meta name="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css" rel="external nofollow" >-->
 
</head>
<body>
 This is my HTML page.
 <br>
 <script type="text/javascript" src="alert.js"></script>
 <script type="text/javascript">
 alert("哈哈哈!!!看,没有标题~_~");
 </script>
</body>
</html>

总结

到此这篇关于js重写alert事件(避免alert弹框标题出现网址)的文章就介绍到这了,更多相关js重写alert事件内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
Javascript 表单之间的数据传递代码
Dec 04 Javascript
JSON取值前判断
Dec 23 Javascript
Javascript 判断两个IP是否在同一网段实例代码
Nov 28 Javascript
Bootstrap CSS布局之表格
Dec 17 Javascript
详解RequireJS按需加载样式文件
Apr 12 Javascript
学习使用Bootstrap栅格系统
May 11 Javascript
vue2.X组件学习心得(新手必看篇)
Jul 05 Javascript
jquery ajaxfileupload异步上传插件
Nov 21 jQuery
详解mpvue小程序中怎么引入iconfont字体图标
Oct 01 Javascript
微信小程序获取用户信息并保存登录状态详解
May 10 Javascript
vue本地打开build后生成的dist文件夹index.html问题
Sep 04 Javascript
js绘制一条直线并旋转45度
Aug 21 Javascript
可拖拽组件slider.js使用方法详解
Dec 04 #Javascript
js实现复制粘贴的两种方法
Dec 04 #Javascript
echarts浮动显示单位的实现方法示例
Dec 04 #Javascript
JavaScript中条件语句的优化技巧总结
Dec 04 #Javascript
三剑客:offset、client和scroll还傻傻分不清?
Dec 04 #Javascript
简单谈谈offsetleft、offsetTop和offsetParent
Dec 04 #Javascript
HTML元素拖拽功能实现的完整实例
Dec 04 #Javascript
You might like
PHP 简单日历实现代码
2009/10/28 PHP
php接口和抽象类使用示例详解
2014/03/02 PHP
PHP FTP操作类代码( 上传、拷贝、移动、删除文件/创建目录)
2014/05/10 PHP
php关键字仅替换一次的实现函数
2015/10/29 PHP
Yii实现简单分页的方法
2016/04/29 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
PHP文件后缀不强制为.php方法
2019/03/31 PHP
js操作textarea方法集合封装(兼容IE,firefox)
2011/02/22 Javascript
js带按钮的提示框可供选择示例代码
2013/09/17 Javascript
微信JS接口汇总及使用详解
2015/01/09 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
2016/06/28 Javascript
HTML的select控件美化
2017/03/27 Javascript
vue父子组件的嵌套的示例代码
2017/09/08 Javascript
Vue 2.0学习笔记之Vue中的computed属性
2017/10/16 Javascript
深入浅析AngularJs模版与v-bind
2018/07/06 Javascript
原生js实现form表单序列化的方法
2018/08/02 Javascript
package.json各个属性说明详解
2020/03/11 Javascript
[05:15]2018年度CS GO社区贡献奖-完美盛典
2018/12/16 DOTA
Python urllib、urllib2、httplib抓取网页代码实例
2015/05/09 Python
python中执行shell的两种方法总结
2017/01/10 Python
Python实现Linux中的du命令
2017/06/12 Python
pandas数据处理基础之筛选指定行或者指定列的数据
2018/05/03 Python
对Pytorch神经网络初始化kaiming分布详解
2019/08/18 Python
Python实现搜索算法的实例代码
2020/01/02 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
凯普林包包西班牙官网:Kipling西班牙
2019/04/12 全球购物
Currentbody澳大利亚:美容仪专家
2019/11/11 全球购物
英国独特家具和家庭用品购物网站:Cuckooland
2020/08/30 全球购物
.NET面试题:什么是反射
2016/09/30 面试题
中学劳技课教师的自我评价
2014/02/05 职场文书
委托公证书
2014/04/08 职场文书
学生无故旷课检讨书
2014/09/20 职场文书
校长一岗双责责任书
2015/05/09 职场文书
导游词之清晏园
2019/11/22 职场文书
redis哨兵常用命令和监控示例详解
2021/05/27 Redis
Vue3中toRef与toRefs的区别
2022/03/24 Vue.js