平常业务中alert经常使用,但是alert经常自带一个网址title,需要自己定义一个弹窗,下面记录下
let customAlert = (message) => {
// 使用原生JavaScript创建一个div作为模拟alert框
var divaa = document.createElement('div');
divaa.innerHTML = "<div style='margin-top: 10%; margin-left: 35%;;width: 30%;padding: 15px;border-radius: 14px;background-color: white;box-shadow: rgb(153, 153, 153) 0px 7px 20px;z-index: 100;'>" + message + "<div style='margin-top:10px;display: flex;justify-content: flex-end'></div></div>";
divaa.style.position = 'fixed';
divaa.style.top = '0%';
divaa.style.left = '0%';
divaa.style.width = '100%';
divaa.style.height = '100%';
divaa.style.background = 'rgb(0,0,0,0.3)';
divaa.style.zIndex = '99';
// // 添加关闭按钮
var closeBtn = document.createElement('div');
closeBtn.innerHTML = "<span style='cursor:pointer;padding:6px 14px; background-color: #3f51b5; color: #fff; border-radius: 20px;'> 确认 </span>"
closeBtn.style.marginTop = '20px';
closeBtn.style.display = 'flex';
closeBtn.style.justifyContent = 'flex-end';
//触发时关闭页面滚动
document.body.style.overflow = 'hidden'
closeBtn.onclick = function () {
divaa.parentNode.removeChild(divaa);
//关闭时页面滚动
document.body.style.overflow = 'visible'
}
divaa.firstChild.appendChild(closeBtn);
// 将div添加到body中
document.body.appendChild(divaa);
}
// // 使用自定义alert函数
customAlert('这是一个自定义的alert对话框。');
直接调用就方法就可以了简单便捷
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。