<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WC弹窗</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
min-height: 100vh; display: flex; align-items: center; justify-content: center;
background: linear-gradient(160deg, #eef4fb, #f8fbff);
}
.card {
text-align: center; background: #fff; padding: 40px 48px;
border: 1px solid #e6ebf1; border-radius: 18px;
box-shadow: 0 18px 44px rgba(35,48,63,.08); max-width: 420px;
}
h1 { font-size: 24px; margin-bottom: 10px; }
p { color: #7a8796; font-size: 14px; margin-bottom: 24px; }
.btns { display: flex; gap: 12px; justify-content: center; }
button {
padding: 12px 22px; border: none; border-radius: 999px; font-size: 15px;
font-weight: 600; cursor: pointer;
}
#start { background: #FF5A5F; color: #fff; }
#start:hover { background: #e0474c; }
#stop { background: #f1f4f8; color: #23303f; }
#stop:hover { background: #e4eaf1; }
.state { margin-top: 18px; font-size: 13px; color: #aab4c0; min-height: 20px; }
</style>
</head>
<body>
<div class="card">
<h1>WC是LLL</h1>
<p>点击下方按钮开始/停止持续弹窗</p>
<div class="btns">
<button id="start">开始弹窗</button>
<button id="stop">停止弹窗</button>
</div>
<div class="state" id="state">未开始</div>
</div>
<script>
(function () {
var running = false;
var timer = null;
var stateEl = document.getElementById("state");
function loop() {
if (!running) return;
alert("WC是LLL");
setTimeout(loop, 60);
}
document.getElementById("start").addEventListener("click", function () {
if (running) return;
running = true;
stateEl.textContent = "弹窗进行中……（关掉标签页即可强制结束）";
loop();
});
document.getElementById("stop").addEventListener("click", function () {
running = false;
if (timer) clearTimeout(timer);
stateEl.textContent = "已停止";
});
})();
</script>
</body>
</html>