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 相关文章推荐
Wordpress ThickBox 添加“查看原图”效果代码
Dec 11 Javascript
在IE 浏览器中使用 jquery的fadeIn() 效果 英文字符字体加粗
Jun 02 Javascript
javascript实现阻止iOS APP中的链接打开Safari浏览器
Jun 12 Javascript
使用jquery+CSS3实现仿windows10开始菜单的下拉导航菜单特效
Sep 24 Javascript
JS实现新浪微博效果带遮罩层的弹出框代码
Oct 12 Javascript
2016年最热门的15 款代码语法高亮工具,美化你的代码
Jan 06 Javascript
详解jQuery中的DOM操作
Dec 23 Javascript
JavaScript取得gridview中获取checkbox选中的值
Jul 24 Javascript
vue-cli webpack配置文件分析
May 20 Javascript
用Angular实现一个扫雷的游戏示例
May 15 Javascript
vue内置组件component--通过is属性动态渲染组件操作
Jul 28 Javascript
原生js实现弹幕效果
Nov 29 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
CodeIgniter框架中_remap()使用方法2例
2014/03/10 PHP
php获取错误信息的方法
2015/07/17 PHP
关于PHP文件的自动运行方法分析
2016/05/13 PHP
php关联数组与索引数组及其显示方法
2018/03/12 PHP
css把超出的部分显示为省略号的方法兼容火狐
2008/07/23 Javascript
js 提交和设置表单的值
2008/12/19 Javascript
在jquery中的ajax方法怎样通过JSONP进行远程调用
2014/04/04 Javascript
Nodejs进程管理模块forever详解
2014/06/01 NodeJs
JavaScript常用标签和方法总结
2015/09/01 Javascript
Sort()函数的多种用法
2016/03/20 Javascript
js实现PC端根据IP定位当前城市地理位置
2017/02/22 Javascript
jQuery 控制文本框自动缩小字体填充
2017/06/16 jQuery
Vue-cli3项目引入Typescript的实现方法
2019/10/18 Javascript
JavaScript arguments.callee作用及替换方案详解
2020/09/02 Javascript
javascript canvas封装动态时钟
2020/09/30 Javascript
antd design table更改某行数据的样式操作
2020/10/31 Javascript
[01:14:30]TNC vs VG 2019国际邀请赛淘汰赛 胜者组赛BO3 第二场 8.20.mp4
2019/08/22 DOTA
sublime text 3配置使用python操作方法
2017/06/11 Python
Python实现的密码强度检测器示例
2017/08/23 Python
创建pycharm的自定义python模板方法
2018/05/23 Python
python进行两个表格对比的方法
2018/06/27 Python
浅谈Python编程中3个常用的数据结构和算法
2019/04/30 Python
python SocketServer源码深入解读
2019/09/17 Python
下载官网python并安装的步骤详解
2019/10/12 Python
pytorch 模型的train模式与eval模式实例
2020/02/20 Python
jupyter 中文乱码设置编码格式 避免控制台输出的解决
2020/04/20 Python
Python3.9.1中使用split()的处理方法(推荐)
2021/02/07 Python
纯css3实现的鼠标悬停动画按钮
2014/12/23 HTML / CSS
使用CSS3实现字体颜色渐变的实现
2020/08/10 HTML / CSS
原料仓管员岗位职责
2014/04/12 职场文书
模具专业自荐信
2014/05/29 职场文书
2014年行政助理工作总结
2014/11/19 职场文书
卫生保健工作总结2015
2015/05/18 职场文书
八月迷情观后感
2015/06/11 职场文书
变长双向rnn的正确使用姿势教学
2021/05/31 Python
Ruby序列化和持久化存储 Marshal和Pstore介绍
2022/04/18 Ruby