关闭或刷新html页面时弹出提示框(本文成功测试于谷歌浏览器)

关闭或刷新html页面时弹出提示框(本文成功测试于谷歌浏览器)
第一步:在html文件中添加如下js代码:
在这里插入图片描述
第二步:编译运行,在浏览器页面操作刷新/关闭时,会弹出提示框
在这里插入图片描述
在这里插入图片描述
注意:上面的方法生效的前题是,打开该网页后,需要鼠标点击一下网页,让网页获取焦点,然后再关闭或刷新! 若打开后不点击页面直接关闭或刷新不会触发该方法。

提示:Chrome和Firefox则只会显示默认的提示对话框,IE会显示出自定义的字符串。

  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
好的,下面是三个功能的示例代码: 1. 创建根据不同来宾显示不同内容的欢迎栏: HTML代码: ```html <div id="welcome-bar"></div> ``` JavaScript代码: ```javascript // 获取当前用户信息 // 这里假设已经有一个函数getUserInfo()可以获取当前用户信息 const userInfo = getUserInfo(); // 根据用户信息生成欢迎栏内容 let welcomeMsg; if (userInfo && userInfo.isLoggedIn && userInfo.role === 'admin') { welcomeMsg = `欢迎,管理员${userInfo.name}!<a href="/admin">进入管理后台</a>`; } else if (userInfo && userInfo.isLoggedIn) { welcomeMsg = `欢迎,${userInfo.name}!`; } else { welcomeMsg = '欢迎访问我们的网站!<a href="/login">登录</a> 或 <a href="/register">注册</a>'; } // 将欢迎栏内容添加到页面中 const welcomeBar = document.getElementById('welcome-bar'); welcomeBar.innerHTML = welcomeMsg; ``` 2. 退页面时显示浏览当前页面的时间: JavaScript代码: ```javascript // 获取页面加载时的时间戳 const startTime = Date.now(); // 在窗口卸载时计算停留时间并显示提示信息 window.addEventListener('beforeunload', () => { const stayTime = Math.round((Date.now() - startTime) / 1000); // 停留时间,单位:秒 alert(`您在本页面停留了${stayTime}秒。`); }); ``` 3. 实现复制表单: HTML代码: ```html <form id="my-form"> <!-- 表单内容 --> </form> <button id="copy-btn">复制表单内容</button> ``` JavaScript代码: ```javascript // 获取要复制的表单内容 const form = document.getElementById('my-form'); const formContent = form.innerHTML; // 在按钮点击时将表单内容复制到剪贴板 const copyBtn = document.getElementById('copy-btn'); copyBtn.addEventListener('click', () => { navigator.clipboard.writeText(formContent).then(() => { alert('表单内容已复制到剪贴板。'); }); }); ``` 希望这些代码能够帮助到你,如果你有任何疑问或需要进一步的帮助,请随时提
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值