JavaScript实现离开页面前提示功能【附jQuery实现方法】


Posted in jQuery onSeptember 26, 2017

本文实例讲述了JavaScript实现离开页面前提示功能。分享给大家供大家参考,具体如下:

离开页面前的提示不可以用onunload去做,因为它只是兼容IE,你要兼容Google与FireFox就蛋疼了。

而且这个事件还是关闭之后才会触发的。

取而代之可以用onbeforeunload去实现。

onbeforeunload可以在用户关闭或刷新窗口、或者点击本页内的任何超级链接都会触发的。

其JavaScript代码如下:

<script>
window.onbeforeunload=function(e){
  var e=window.event||e;
  e.returnValue=("确定离开当前页面吗?");
}
</script>

非常简短,一开始利用window.event与e的或,兼容浏览器。

其返回值就是提示信息。

在IE8的效果如下,第一行与最后一行是必须存在的。用户点击“取消”不会发生任何事情,点击“确定”则继续之前的动作。

JavaScript实现离开页面前提示功能【附jQuery实现方法】

在Google Chrome的效果如下,只有最后一行是我们可以控制的,其它都是系统本身就有的东西,不能够被改写。

JavaScript实现离开页面前提示功能【附jQuery实现方法】

野狐禅的效果如下,其提示信息读不出来,我也没办法,谁叫这个浏览器是野狐禅呢?

JavaScript实现离开页面前提示功能【附jQuery实现方法】

这段东西,用JQuery则这样写:

$(window).bind('beforeunload',function(){
  return '提示信息';
  }
);

JQuery1.9自带全浏览器兼容……

希望本文所述对大家JavaScript程序设计有所帮助。

jQuery 相关文章推荐
Django1.7+JQuery+Ajax验证用户注册集成小例子
Apr 08 jQuery
Spring shiro + bootstrap + jquery.validate 实现登录、注册功能
Jun 02 jQuery
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 jQuery
jQuery实现菜单栏导航效果
Aug 15 jQuery
jQuery Collapse1.1.0折叠插件简单使用
Aug 28 jQuery
jQuery 实现鼠标画框并对框内数据选中的实例代码
Aug 29 jQuery
jQuery实现可兼容IE6的滚动监听功能
Sep 20 jQuery
jQuery实现鼠标响应式淘宝动画效果示例
Feb 13 jQuery
jQuery 选择器用法实例分析【prev + next】
May 22 jQuery
jQuery+ajax实现文件上传功能
Dec 22 jQuery
jQuery实现电梯导航模块
Dec 22 jQuery
详解jQuery的核心函数和事件处理
Feb 18 jQuery
jQuery EasyUI Layout实现tabs标签的实例
Sep 26 #jQuery
jQuery EasyUI开发技巧总结
Sep 26 #jQuery
jQuery 开发之EasyUI 添加数据的实例
Sep 26 #jQuery
JS+jQuery实现注册信息的验证功能
Sep 26 #jQuery
zTree jQuery 树插件的使用(实例讲解)
Sep 25 #jQuery
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 #jQuery
一个有意思的鼠标点击文字特效jquery代码
Sep 23 #jQuery
You might like
抓取并下载CSS中所有图片文件的php代码
2011/09/26 PHP
php缩小png图片不损失透明色的解决方法
2013/12/25 PHP
详解WordPress中简码格式标签编写的基本方法
2015/12/22 PHP
PHP操作MySQL的mysql_fetch_* 函数的常见用法教程
2015/12/25 PHP
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
PHP判断文件是否被引入的方法get_included_files用法示例
2016/11/29 PHP
jQuery中prepend()方法用法实例
2014/12/25 Javascript
JS实现仿google、百度搜索框输入信息智能提示的实现方法
2015/04/20 Javascript
JS实现网页标题随机显示名人名言的方法
2015/11/03 Javascript
深入理解jQuery之防止冒泡事件
2016/05/24 Javascript
Angular使用$http.jsonp发送跨站请求的方法
2017/03/16 Javascript
详解vue2.0脚手架的webpack 配置文件分析
2017/05/27 Javascript
详解升级react-router 4 踩坑指南
2017/08/14 Javascript
mint-ui 时间插件使用及获取选择值的方法
2018/02/09 Javascript
js打开word文档预览操作示例【不是下载】
2019/05/23 Javascript
Vue.js 无限滚动列表性能优化方案
2019/12/02 Javascript
es6 for循环中let和var区别详解
2020/01/12 Javascript
JS实现长图上下滚动效果
2020/03/19 Javascript
Openlayers+EasyUI Tree动态实现图层控制
2020/09/28 Javascript
[06:20]2015国际邀请赛第三日top10
2015/08/08 DOTA
[52:44]VGJ.T vs infamous Supermajor小组赛D组败者组第一轮 BO3 第一场 6.3
2018/06/04 DOTA
python之wxPython菜单使用详解
2014/09/28 Python
Python语言实现获取主机名根据端口杀死进程
2016/03/31 Python
python 用下标截取字符串的实例
2018/12/25 Python
详解python中sort排序使用
2019/03/23 Python
实例详解python函数的对象、函数嵌套、名称空间和作用域
2019/05/31 Python
django框架model orM使用字典作为参数,保存数据的方法分析
2019/06/24 Python
Python大数据之从网页上爬取数据的方法详解
2019/11/16 Python
python爬虫---requests库的用法详解
2020/09/28 Python
pycharm 的Structure界面设置操作
2021/02/05 Python
澳洲网红粉泥面膜:Sand & Sky
2019/08/13 全球购物
梅西百货官网:Macy’s
2020/08/04 全球购物
中海讯通笔试题
2015/09/15 面试题
材料加工硕士生求职信
2013/10/10 职场文书
详解Python小数据池和代码块缓存机制
2021/04/07 Python
vue3中provide && inject的使用
2021/07/01 Vue.js