document.activeElement 过滤选择文件弹窗导致的页面失焦
在线考试页面,常常需要检测用户是否作弊。
一般是监听页面是否失焦的方式,而失焦的方式有很多种,比如QQ弹窗,切换页面,切换程序,input文件上传选择文件等
选择文件是正常情况,这种情况下需要过滤
本文很简单,其实就是 document.activeElement 的使用,获取当前页面上的焦点元素
鼠标点击或Tab切换时都可以触发获取
一般是表单input、textarea、select等,此外就是body项
<input type="text" name="">
<input type="file" name=""> <script type="text/javascript">
window.onblur = function() {
var elem = document.activeElement; console.log(elem); if (elem.getAttribute('type') !== 'file') {
console.log('blur');
}
};
</script>

过滤了文件选择导致的弹窗,这个属性的支持度还是可以的

不过,用JS检测是否为QQ弹窗,目前来说还是行不通的,只好提示用户在考试之前关闭相关可能会弹窗的应用
document.activeElement 过滤选择文件弹窗导致的页面失焦的更多相关文章
- python pandas合并多个excel(xls和xlsx)文件(弹窗选择文件夹和保存文件)
# python pandas合并多个excel(xls和xlsx)文件(弹窗选择文件夹和保存文件) import tkinter as tk from tkinter import filedial ...
- html5表单上传控件Files筛选指定格式的文件:accept属性过滤excel文件
摘自:http://blog.csdn.net/jyy_12/article/details/9851349 (IE9及以下不支持下面这些功能,其它浏览器最新版本均已支持.) 1.允许上传文件数量 允 ...
- file类型允许的文件格式设置问题,“选择文件”打开缓慢
1,file类型的input对于打开的选择框的属性是由以下两个属性控制的: ①multiple="multiple" :一次可以选择多个文件 ②accept="image ...
- C#选择文件、选择文件夹、打开文件(或者文件夹)
1.选择文件用OpenDialog OpenFileDialog dialog = new OpenFileDialog(); dialog.Multiselect = true;//该值确定是否可以 ...
- VBS脚本代码(手工编写---在windows 7上调用系统对话框,来选择文件)
'=========================================================================='' VBScript Source File - ...
- ng-file-upload(在单文件选择,并且通过点击“上传”按钮上传文件的情况下,如何在真正选择文件之前保留上一文件信息?)
文章前面研究ng-file-upload可能涉及指令: You can use ng-model or ngf-change instead of specifying function for ng ...
- MyWebViewDemo【封装Webview常用配置和选择文件、打开相机、录音、打开本地相册的用法】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 封装webview的常用配置和选择文件.打开相机.录音.打开本地相册的用法.[如果想要使用简单的预览功能,可以参考<MyBri ...
- C#选择文件、选择文件夹、打开文件
1.选择文件用OpenDialog OpenFileDialog dialog = new OpenFileDialog(); dialog.Multiselect = true;//该值确定是否可以 ...
- C# 选择文件、选择文件夹、打开文件(或者文件夹) 路径中获取文件全路径、目录、扩展名、文件名称 追加、拷贝、删除、移动文件、创建目录 修改文件名、文件夹名!!
https://www.cnblogs.com/zhlziliaoku/p/5241097.html 1.选择文件用OpenDialog OpenFileDialog dialog = new Ope ...
随机推荐
- 五 : springMVC拦截器
springMVC拦截器的实现一般有两种方式 第一种方式是要定义的Interceptor类要实现了Spring的HandlerInterceptor 接口 第二种方式是继承实现了HandlerInte ...
- Spider_Man_3 の selenium
一:介绍 selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决requests无法直接执行JavaScript代码的问题 selenium本质是通过驱动浏览器,完全模拟浏览器的操作, ...
- 记录idea maven项目打包部署web项目mapper扫描失败
最开始以为这里出了问题,后来加上以后还是不能把mapper.xml打包进去 这是报的异常信息 Mybatis启动老是报绑定错误(找不到Mapper对应的 SQL配置),经过一番Google未能解决问题 ...
- Cannot declare class app\home\controller\Cases because the name is already in use
Cannot declare class app\home\controller\Cases because the name is already in use 命名空间冲突了 use 模型类的时候 ...
- dede内容页调用图片集下所有图片方法!
http://blog.csdn.net/forest_fire/article/details/50943765 版权声明:本文为博主原创文章,未经博主允许不得转载. {dede:productim ...
- linux 下 用phpmailer类smtp发送邮件始终不成功,提示:ERROR: Failed to co
https://zhidao.baidu.com/question/509191264.html?fr=iks&word=PHPMailerSMTP+connect()+failed& ...
- Varnish的vcl子程序
Varnish的VCL子程序 以下内容参考: http://book.varnish-software.com/4.0/ VCL子进程,在其中定制Varnish的行为.VCL子例程可用于:添加自定义标 ...
- FORM ACTION=""
FORM ACTION="" 如果什么都不写,就表示提交到当前页
- Sencha Touch vs jQuery Mobile
Sencha Touch:重量级框架,类似于Flex SDK;组件封装较多;在各平台交互表现统一(内部封装);入门门槛较高 jQuery Mobile:轻量级框架,实质是jQuery插件;组件较少;交 ...
- Hyperledger Fabric Transaction Flow——事务处理流程
Transaction Flow 本文概述了在标准资产交换过程中发生的事务机制.这个场景包括两个客户,A和B,他们在购买和销售萝卜(产品).他们每个人在网络上都有一个peer,通过这个网络,他们发送自 ...