beforeunload在离开页面前执行业务逻辑

window有个beforeunload事件,是在离开页面前触发的;大家肯定会很快联想到unload这个事件,二者有的区别还是蛮大的,字面上就很好理解,beforeunload在时间线上在unload之前执行,分解点就是页面卸载时间;

经常会有一些在用户离开页面前执行一些业务的应用场景,这都要用到onbeforeunload事件;比如记录用户停留时长的业务,在GA等页面访问统计的应用中都包含这个:

 1 ;(function(){
 2     var startTime = Math.ceil(new Date().getTime()/1000), //单位秒
 3         getDuration = function(){
 4             var time = ‘‘,
 5                 hours = 0,
 6                 minutes = 0,
 7                 seconds = 0,
 8                 endTime = Math.ceil(new Date().getTime()/1000),
 9                 duration = endTime - startTime;
10
11             hours = Math.floor(duration/3600); //停留小时数
12             minutes = Math.floor(duration%3600/60); //停留分钟数
13             seconds = Math.floor(duration%3600%60); //停留秒数
14
15             time = (hours < 10 ? ‘0‘ + hours : hours) + ‘:‘ + (minutes < 10 ? ‘0‘ + minutes : minutes) + ‘:‘ + (seconds < 10 ? ‘0‘ + seconds : seconds);
16
17             return time;
18         };
19
20
21     window.onbeforeunload = function(e){
22         var duration = getDuration();
23
24         //request(duration);
25     };
26 })();
时间: 2025-01-05 22:25:24

beforeunload在离开页面前执行业务逻辑的相关文章

【JavaScript】离开页面前提示

离开页面前的提示不能够用onunload去做,由于它仅仅是兼容IE,你要兼容Google与FireFox就蛋疼了. 并且这个事件还是关闭之后才会触发的. 取而代之能够用onbeforeunload去实现. onbeforeunload能够在用户关闭或刷新窗体.或者点击本页内的不论什么超级链接都会触发的. 其JavaScript代码例如以下: <script> window.onbeforeunload=function(e){ var e=window.event||e; e.returnVa

前端开发--播放页面评论区业务逻辑初步

1.这次主要涉及前后端的数据交互 jquery 教程: http://www.w3school.com.cn/jquery/index.asp 2.工程地址:https://github.com/digitalClass/web_page 网站发布地址: http://115.28.30.25:8029/ 3. 业务逻辑说明: 初步设想是这样的: 用户点击提交之后, 前端将评论 content 以及 用户 userid 这两个数据 post 给后端,  暂时预定的 路由为 /addcomment

Jquery判断离开页面时,通过Ajax更新数据(兼容IE,Chrome,FF浏览器)

现在很多项目都有客户离开网页时,处理一些业务的需求.所以焦点就聚集在了如何获取页面离开事件. 以下是本人在一个项目中需要记录页面浏览时长的处理办法,测试兼容IE,Chrome,FF浏览器 代码如下: <!DOCTYPE html> <html> <head> <script type="text/javascript"> $(window).bind('beforeunload', function(e) {//页面卸载,就是用户关闭页面

django--BBS项目,后端业务逻辑整理

经典的生活价值观 别让人生,输给了心情.心情不是人生的全部,却能左右人生的全部.心情好,什么都好,心情不好,一切都乱了.我们常常不是输给了别人,而是坏心情贬低了我们的形象,降低了我们的能力,扰乱了我们的思维,从而输给了自己. 控制好心情,生活才会处处祥和.好的心态塑造好心情,好心情塑造最出色的你. 静静的过自己的生活,心若不动,风又奈何.你若不伤,岁月无恙. BBS 项目开发逻辑梳理 第一步:先进行数据库设计 数据库设计规则是: 1.先创建基表:用户表.站点表.文章表.标签表.分类表.文章2标签

微软-创建业务逻辑层

https://msdn.microsoft.com/zh-cn/dd255899 简介 在教程一中创建的数据访问层 (DAL) 将数据访问逻辑与表示逻辑清晰地分离开来.然而,尽管 DAL 从表示层中清晰地分离出数据访问层细节,它却并没有实施任何可能采用的业务规则.例如,我们想让我们的应用程序在 Discontinued 字段设为 1 时禁止对 Products 表的 CategoryID 或 SupplierID 字段的修改,还有,我们可能想实施一些资历规则以便禁止发生这样的情况:雇员被其后入

JavaEE使用三层架构(显示层、业务逻辑层、数据访问层)实现数据的增删改查

实例: 1.功能描述 实现一个简易新闻发布系统,包括查看.添加.修改和删除新闻等基本功能 2.具体要求 (1) 创建数据库 newssystem,创建表 news,要求如下: (2) 程序运行时,显示'发布新闻'页面(如图 1),输入相关内容,单击'提交'按钮,将新闻内容添加到数据库 (3) 单击图 1 中的'查看'按钮,显示'查看新闻'页面(如图 2),增加'修改'和'删除'链接 (4) 单击图 2 中的'update'链接,显示'修改新闻'页面(如图 3),修改后单击'修改'按钮确认,单击'

在 ASP.NET 中创建数据访问和业务逻辑层(转)

.NET Framework 4 当在 ASP.NET 中处理数据时,可从使用通用软件模式中受益.其中一种模式是将数据访问代码与控制数据访问或提供其他业务规则的业务逻辑代码分开.在此模式中,这两个层均与表示层分离.表示层由网站用户有权查看或更改数据的页面组成. ASP.NET 可通过多种方式提供数据访问.业务逻辑和表示形式之间的分离.例如,数据源模型(包括 LinqDataSource 和 ObjectDataSource 等服务器控件)可将表示层与数据访问代码和业务逻辑分离. 另一种模式是将数

系统架构师-基础到企业应用架构-业务逻辑层

一.上章回顾 上章我们主要讲述了系统设计规范与原则中的具体原则与规范及如何实现满足规范的设计,我们也讲述了通过分离功能点的方式来实现,而在软件开发过程中的具 体实现方式简单的分为面向过程与面向对象的开发方式,而目前更多的是面向对象的开发设计方式.并且我们也讲述了该如何通过设计手段去分析功能点及设计分离 点,应该如何在设计的过程中分析的角度及如何去满足设计规范与原则.首先我们通过下图来回顾下上章要点: 二.摘要 本文将已架构的方式去分析分层结构中的业务层的设计,如何写出来内聚度,高耦合的业务逻辑层

ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装

原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(4)-业务逻辑层的封装 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇)   (1):框架搭建    (2):数据库访问层的设计Demo    (3):面向接口编程 前言:前面几篇博客我们基本已经介绍完了搭建整个项目和数据库访问层以及一些业务逻辑层的实现,当然了,我们的数据库访问层这样还是可以在进行封装的,但是我到这里就行了吧,项目也不大,不需要那么麻烦的,那么我们今天开始介绍我们需要介绍的内容,那就是我