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 相关文章推荐
jquery 键盘事件的使用方法详解
Sep 13 jQuery
jQuery中 DOM节点操作方法大全
Oct 12 jQuery
jQuery实现简单的回到顶部totop功能示例
Oct 16 jQuery
基于jQuery实现Ajax验证用户名是否可用实例
Mar 25 jQuery
jQuery.validate.js表单验证插件的使用代码详解
Oct 22 jQuery
jQuery实现的自定义轮播图功能详解
Dec 28 jQuery
jquery获取img的src值实例介绍
Jan 16 jQuery
jquery的$().each和$.each的区别
Jan 18 jQuery
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
jQuery操作事件完整实例分析
Jan 10 jQuery
jQuery实现王者荣耀手风琴效果
Jan 17 jQuery
jQuery 实现扁平式小清新导航
Jul 07 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
PHP禁止个别IP访问网站
2013/10/30 PHP
php强制运行广告的方法
2014/12/01 PHP
php使用wordwrap格式化文本段落的方法
2015/03/17 PHP
PHP模板引擎Smarty内建函数详解
2016/04/11 PHP
Laravel 实现添加多语言提示信息
2019/10/25 PHP
alixixi runcode.asp的代码不错的应用
2007/08/08 Javascript
JavaScript高级程序设计(第3版)学习笔记8 js函数(中)
2012/10/11 Javascript
jQuery之ajax技术的详细介绍
2013/06/19 Javascript
jquery实现微博文字输入框 输入时显示输入字数 效果实现
2013/07/12 Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
2013/08/26 Javascript
JavaScript-RegExp对象只能使用一次问题解决方法
2014/06/23 Javascript
js实现checkbox全选、不选与反选的方法
2015/02/09 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
2015/03/18 Javascript
使用plupload自定义参数实现多文件上传
2016/07/19 Javascript
JS实现一次性弹窗的方法【刷新后不弹出】
2016/12/26 Javascript
jquery mobile实现可折叠的导航按钮
2017/03/11 Javascript
详解Angular 自定义结构指令
2017/06/21 Javascript
Angular 4中如何显示内容的CSS样式示例代码
2017/11/06 Javascript
基于nodejs实现微信支付功能
2017/12/20 NodeJs
深入浅析vue中cross-env的使用
2019/09/12 Javascript
在Python中操作时间之tzset()方法的使用教程
2015/05/22 Python
python爬虫之BeautifulSoup 使用select方法详解
2017/10/23 Python
详解pandas数据合并与重塑(pd.concat篇)
2019/07/09 Python
Python3中的f-Strings增强版字符串格式化方法
2020/03/04 Python
在spyder IPython console中,运行代码加入参数的实例
2020/04/20 Python
Pycharm IDE的安装和使用教程详解
2020/04/30 Python
如何利用Python 进行边缘检测
2020/10/14 Python
Amara美国站:英国高端家居礼品网站,世界各地的奢侈家具品牌
2017/07/26 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
实习生自荐信范文
2013/11/13 职场文书
婚庆公司的创业计划书
2014/01/22 职场文书
营销总监岗位职责范本
2014/02/26 职场文书
英语教育专业毕业生求职信
2014/08/28 职场文书
农村党支部书记司法四风问题对照检查材料
2014/09/26 职场文书
职称评定个人总结
2015/03/05 职场文书
教你利用Nginx 服务搭建子域环境提升二维地图加载性能的步骤
2021/09/25 Servers