window对象监听浏览器页签之间的切换状态;前端监听浏览器切换页签的触发时机

window对象监听浏览器页签之间的切换状态
记录两种办法

第一种:会将任何鼠标点进或点出浏览器的操作监听;同页面也会触发
// 窗口获得焦点时的回调函数
function onWindowFocus() {console.log('窗口获得焦点');querySubmit()
}
// 窗口失去焦点时的回调函数
function onWindowBlur() {console.log('窗口失去焦点');
}
// 添加事件监听器
window.addEventListener('focus', onWindowFocus);
window.addEventListener('blur', onWindowBlur);
第二种:此方法只在切屏或切换页签触发
const handler = () => {// 也可以通过document.hidden属性(布尔类型)来判断// window.document.hidden (True/False)// document.visibilityState拥有两种字符串枚举值('visible' 和 'hidden')if (window.document.visibilityState === 'visible') {// 当页签处于可见状态,TODOconsole.log("出现")} else {// 当页签处于不可见状态(hidden),TODOconsole.log("消失")}
};
window.document.addEventListener('visibilitychange', handler);

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/45153.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第2章 源码编译构建LAMP

LAMP LAMP是一个常见的开发平台和运行环境,主要用于支持动态网站和Web应用程序的开发和部署。 L: Linux,指操作系统,通常是Linux操作系统。A: Apache,指Web服务器软件,常用于托管网站。M: MySQL,指关系型…

推荐一个比 Jenkins 使用更简单的项目构建和部署工具

最近发现了一个比 Jenkins 使用更简单的项目构建和部署工具,完全可以满足个人以及一些小企业的需求,分享一下。 项目介绍 Jpom 是一款 Java 开发的简单轻量的低侵入式在线构建、自动部署、日常运维、项目监控软件。 日常开发中,Jpom 可以解…

uniapp js 用dom创建form表单 并提交

// 创建一个新的form元素 var form window.document.createElement(form); // 设置form的method和action属性 form.method POST; form.action https://xxx; …

python--实验8 函数(2)

知识点 变量的作用域 定义:解释了局部变量和全局变量的概念。局部变量: 局部变量是在函数内部定义的变量。它们只在该函数内部可见,一旦函数执行完毕,这些变量就会被销毁。例子:在函数内部通过赋值创建的变量。全局…

macbook触控栏养宠物:Touchbar pet for Mac 免费下载

macbook pro自从出了touchbar后,看起来是十分的炫酷,但平时却很少有人使用,为了让touchbar充分利用起来,Touch bar pet就横空出世了,可爱的画风,简单的玩法,让你可以在touchbar上也可以养一只自…

网络安全就业方向(非常详细)零基础入门到精通,收藏这一篇就够了

这里我整合并且整理成了一份【282G】的网络安全/红客技术从零基础入门到进阶资料包,需要的小伙伴文末免费领取哦,无偿分享!!! 对于从来没有接触过网络安全的同学,我们帮你准备了详细的学习成长路线图。可以…

2.5 计算机网络

声明:文章参考的《系统架构设计师教程(第二版)》,如有侵权,本人将立即修改和删除。 利用通信线路将地理上分散的、具有独立功能的计算机系统和通信设备按不同的形式连接起来,并依靠网络软件以及通信协议实现…

p15 p16 c语言实现三子棋

具体的实现代码 game.c #include "game.h"void InitBoard(char board[ROW][COL], int row, int col) {int i 0;int j 0;for (i 0; i < row; i) {for (j 0; j < col; j) {board[i][j] ;}} }void DisplayBoard(char board[ROW][COL], int row, int col) …

算法训练(leetcode)第二十九天 | 62. 不同路径、63. 不同路径 II

刷题记录 *62. 不同路径63. 不同路径 II *62. 不同路径 leetcode题目地址 每个单元格的数值都是有上方和左侧的单元格决定的&#xff0c;因此需要先将最上方和最左侧的单元格初始化。因为题目要求只能向下和向右移动&#xff0c;因此最上方和最左侧的单元格初始化为1。 时间…

《昇思25天学习打卡营第8天 | mindspore 模型保存与加载用法》

1. 背景&#xff1a; 使用 mindspore 学习神经网络&#xff0c;打卡第8天&#xff1b; 2. 训练的内容&#xff1a; 为了微调&#xff08;fine-tune&#xff09;和后续的模型推理与部署&#xff0c;因此需要保存模型的参数&#xff0c;本小结主要训练保存模型。 3. 常见的用…

【java实现结果集转为树结构,树转为扁平结构】

list转为树&#xff0c;树拉平 业务需求oracle实现树结构1、**Controller.java层** &#xff1a;前端调此处请求2、**service层&#xff1a;** 逻辑结构 &#xff08;zbjcpjService.java&#xff09;&#xff0c;重点&#xff1a;this.entityMapper.queryZbjcpjTree接口3、**ma…

【python算法学习1】用递归和循环分别写下 fibonacci 斐波拉契数列,比较差异

问题&#xff1a; fibonacci 斐波拉契数列&#xff0c;用递归和循环的方法分别写,比较递归和循环的思路和写法的差别 最直接的思路&#xff0c;是写递归方法 循环方法的稍微有点绕&#xff0c;我觉得问题主要是出在&#xff0c;总结循环的通项公式更麻烦&#xff0c;难在数学…

多目标螳螂搜索算法MOMSA求解无人机三维路径规划,可以自行修改障碍物位置(MATLAB代码)

无人机路径规划多目标优化求解是一个复杂的过程&#xff0c;涉及到多个目标的考量和优化算法的应用。以下是一些关键点和相关算法的概述&#xff1a; 1. **多目标优化策略**&#xff1a;在无人机路径规划中&#xff0c;需要同时考虑多个目标&#xff0c;如路径长度、安全性、飞…

关于delete和delete[ ]混用的未定义问题解释

我们知道delete用于释放一个动态空间&#xff0c;而delete[ ]用于释放多个动态空间&#xff0c;但是如果我们混用的话会导致什么问题&#xff1f;我在博客上看了许多文章&#xff0c;但不尽人意&#xff0c;因此写下这篇文章让你知其然知其所以然&#xff08;浅薄的解释&#x…

大数据学习之Spark基础

Spark基础 简述 1、spark作业执行的特点&#xff1a; &#xff08;1&#xff09;只有遇到行动算子的时候&#xff0c;整个spark作业才会被触发执行 &#xff08;2&#xff09;遇到几次&#xff0c;执行几次 2、RDD: 弹性分布式数据集 弹性&#xff1a;数据量可大可小 RDD类似…

插片式远程 I/O模块:Profinet总线耦合器在SIMATIC Manager配置

XD9000是Profinet总线耦合器&#xff0c;单个耦合器最多可扩展32个I/O模块&#xff01;本文将详细介绍如何在SIMATIC Manager中配置插片式远程 I/O模块的Profinet总线耦合器&#xff0c;帮助您更好地应用这一技术。 一、SIMATIC Manager软件组态步骤&#xff1a; 1、创建工程&…

MySQL8之mysql-community-icu-data-files的作用

MySQL8中的mysql-community-icu-data-files包主要提供国际组件&#xff08;ICU&#xff0c;International Components for Unicode&#xff09;的数据文件&#xff0c;这些文件对于MySQL数据库处理多语言数据和进行Unicode字符集转换至关重要。具体来说&#xff0c;mysql-commu…

什么是敏捷本地化

快速、敏捷的多语言产品和服务交付正逐渐成为众多行业的常态。在这种情况下&#xff0c;重点从传统的期望&#xff08;即在合理的时间框架内翻译大量内容&#xff09;转变为翻译工作量非常大的小片段&#xff0c;通常在2-3到12-24小时之间&#xff0c;通常在周末或假期。 Logr…

IntelliJ IDEA自定义菜单(Menus)、任务栏(toolbars)详细教程

一、自定义菜单 1、打开Settings&#xff0c;找到Menus and Toolbars 2、点击右边的Main Menu&#xff0c;点击号&#xff0c;选择Add Action 3、弹出Add Action弹窗&#xff0c;搜索或者选择你要添加的指令 二、自定义工具栏 1、右键IDEA上方的工具栏空白位置&#xff0c;选…

AIGC各个应用场景下的模型选择

需要注意的是&#xff0c;下述模型可以在不同任务和领域中灵活应用&#xff0c;它们的归属也会根据模型的设计和主要应用领域而有所变化&#xff0c;并不绝对。 自然语言处理模型 模型层中自然语言理解(Natural LanguageUnderstanding&#xff0c;NLU)和自然语言生成(NaturalL…