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 相关文章推荐
写js时遇到的一些小问题
Dec 06 Javascript
兼容IE和FF的图片上传前预览js代码
May 28 Javascript
jquery禁用右键示例
Apr 28 Javascript
AngularJS基础 ng-mousemove 指令简单示例
Aug 02 Javascript
正则 js分转元带千分符号详解
Mar 08 Javascript
JavaScript输出所选择起始与结束日期的方法
Jul 12 Javascript
浅谈用Webpack路径压缩图片上传尺寸获取的问题
Feb 22 Javascript
vue之浏览器存储方法封装实例
Mar 15 Javascript
JavaScript箭头函数中的this详解
Jun 19 Javascript
微信小程序的开发范式BeautyWe.js入门详解
Jul 10 Javascript
Echarts地图添加引导线效果(labelLine)
Sep 30 Javascript
vue-cli —— 如何局部修改Element样式
Oct 22 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
PHPMailer 中文使用说明小结
2010/01/22 PHP
深入phpMyAdmin的安装与配置的详细步骤
2013/05/07 PHP
php强制文件下载而非在浏览器打开的自定义函数分享
2014/05/08 PHP
php获取指定日期之间的各个周和月的起止时间
2014/11/24 PHP
PHP中的数组处理函数实例总结
2016/01/09 PHP
如何解决PHP使用mysql_query查询超大结果集超内存问题
2016/03/14 PHP
Symfony控制层深入详解
2016/03/17 PHP
PHP中如何判断exec函数执行成功?
2016/08/04 PHP
20行代码实现的一个CSS覆盖率测试脚本
2013/07/07 Javascript
jquery对元素拖动排序示例
2014/01/16 Javascript
jquery单行文字向上滚动效果示例
2014/03/06 Javascript
JavaScript三元运算符的多种使用技巧
2015/04/16 Javascript
开启Javascript中apply、call、bind的用法之旅模式
2015/10/28 Javascript
js两种拼接字符串的简单方法(必看)
2016/09/02 Javascript
详解Node.js中的事件机制
2016/09/22 Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
2017/01/25 Javascript
js中setTimeout的妙用--防止循环超时
2017/03/06 Javascript
vue cli升级webapck4总结
2018/04/04 Javascript
Vue自定义指令封装节流函数的方法示例
2018/07/09 Javascript
Element Notification通知的实现示例
2020/07/27 Javascript
你所不知道的Python奇技淫巧13招【实用】
2016/12/14 Python
Python网络爬虫神器PyQuery的基本使用教程
2018/02/03 Python
关于python字符串方法分类详解
2019/08/20 Python
numpy求平均值的维度设定的例子
2019/08/24 Python
Python算法的时间复杂度和空间复杂度(实例解析)
2019/11/19 Python
浅谈图像处理中掩膜(mask)的意义
2020/02/19 Python
KIKO比利时官网:意大利彩妆品牌
2017/07/23 全球购物
豪华复古化妆:Besame Cosmetics
2019/09/06 全球购物
雷锋精神演讲稿
2014/05/13 职场文书
暑期培训心得体会
2014/09/02 职场文书
2015年乡镇财政工作总结
2015/05/19 职场文书
会计岗位工作总结
2015/08/12 职场文书
如何开发一个渐进式Web应用程序PWA
2021/05/10 Javascript
Python捕获、播放和保存摄像头视频并提高视频清晰度和对比度
2022/04/14 Python
springboot读取nacos配置文件
2022/05/20 Java/Android
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python