devicemotion 或者 deviceorientation在window.addEventListener 事件中不生效,没有输出内容

问题:devicemotion 或者 deviceorientation 在window.addEventListener 事件中不生效,没有输出内容

原因:

1、必须在Https协议下才可使用

2、必须用户手动点击click事件中调用 ,进行权限申请

源码:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=375,user-scalable=0"><title>deviceorientation</title>
</head>
<body><button onclick="start()">start</button>
<script>(function () { var script = document.createElement('script'); script.src="https://cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();function start(){if(!DeviceMotionEvent){console.error('暂时不支持')}else{if(DeviceMotionEvent.requestPermission){DeviceMotionEvent.requestPermission().then(permissionState => {console.log(permissionState)if (permissionState === 'granted') {// window.addEventListener('devicemotion', function(e) { console.log('devicemotion', e)}, true);window.addEventListener('deviceorientation', function(event) { console.log('deviceorientation', event) ; console.log(`${event.alpha} : ${event.beta} : ${event.gamma}`);}, true);}}).catch((err) => {console.error(err);});}else{// window.addEventListener('devicemotion', function(e) { console.log('devicemotion', e)}, true);window.addEventListener('deviceorientation', function(event) { console.log('deviceorientation', event) ; console.log(`${event.alpha} : ${event.beta} : ${event.gamma}`);}, true);}}}window.onload=function(){start() //此处调用无效,没有内容输出}
</script></body>
</html>

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

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

相关文章

JVM 虚拟机

JVM 是 Java Virtual Machine 的简称&#xff0c;意为 Java 虚拟机&#xff0c;虚拟机是指通过软件模拟的具有完整硬件功能的、运行在一个完全隔离的环境中的完整计算机系统。 常见的虚拟机有&#xff1a;JVM、VMwave、Virtual Box等。JVM 是一台被定制过的现实当中不存在的计算…

行政工作如何提高效率?桌面备忘录便签软件哪个好

在行政管理工作中&#xff0c;效率的提高无疑是每个行政人员都追求的目标。而随着科技的发展&#xff0c;各种便捷的工具也应运而生&#xff0c;其中桌面备忘录便签软件便是其中的佼佼者。那么&#xff0c;这类软件又如何帮助我们提高工作效率呢&#xff1f; 首先&#xff0c;…

C语言| 求1到100之间所有奇数的和偶数之和

思路&#xff1a; 1 用到for循环功能&#xff1b; 2 定义两个循环变量i j , 奇数 i 1每次加2&#xff0c;偶数 j 0 每次加2 3 求和放在for 循环中间&#xff0c;每遍历一次就相加。 /* 求1到100之间所有奇数的和 求1到100之间所有偶数之和 */ #include <stdio.h> …

Vue前端中从后端获取图片验证码

前端发送请求 <template><el-form :model"user" :rules"rules" ref"userForm" class"login" label-width"auto" style"max-width: 600px"><el-form-item label"用户名" prop"name…

SqlServer还原系统库步骤及问题解决

还原master 需要切换到binn目录 Cd C:\Program Files\Microsoft SQL Server\MSSQL10_50.MSSQLSERVER\MSSQL\Binn 关闭服务 用单用户模式启动 SQL Server 默认实例 sqlservr.exe -m 直接单用户登录 恢复master备份文件 RESTORE DATABASE master FROM DISK E:\dbbak\txic_ke…

react 表格实现拖拽功能

项目背景 : react ant 单纯实现拖拽确实不难 , 我的需求是根据后台接口返回 , 生成对应的父子表格 , 并只可以拖拽子的位置 , 如图 后台返回的数据结构 (pid为0说明是父 , 子的pid等于父的id , 说明是父的子) 1 , 我先转成了树形结构且自己加上了key (注意 : key一定得是唯一的…

Resilience4j结合微服务出现的异常

Resilience4j结合微服务出现的异常 1、retry未生效 由于支持aop&#xff0c;所以要引入aop的依赖。 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-aop</artifactId> </dependency>2、circ…

gamit前导软件linus的root账号登录

1computer---etc- --lightdm-- 2进入超级管理员 gedit ./lightdm.conf [SeatDefaults] greeter-sessionunity-greeter user-sessionubuntu greeter-show-manual-logintrue allow-guestfalse 保存文档&#xff0c;关闭文档 3删除文档 users.conf删除 rm -f users.conf 4…

6. C++通过fork的方式实现高性能网络服务器

我们上一节课写的tcp我们发现只有第一个与之连接的人才能收发信息。他又很多的不足 高性能网络服务器 通过fork实现高性能网络服务器 我们通过fork进行改装之后就可以成百上千的用户进行连接访问&#xff0c;对于每一个用户来说我们都fork一个子进程。让后让每一个子进程都是…

人大金仓数据库大小写不敏感确认

1、图形化确认(管理—其他选项—预设选项) 2、命令行确认 # ksql -p 54321 -U system test # show enable_ci; 查看是否大小写敏感&#xff0c;on表示大小敏感&#xff0c;off表示大小写不敏感&#xff0c;使用某些项目的时候&#xff0c;需要设置数据库大小写不敏感&#…

C#发票查验接口提升财税服务效率与透明度

在传统模式下&#xff0c;代理记账工作往往涉及大量手工录入和核对发票信息的过程&#xff0c;不仅耗时费力&#xff0c;还容易出现人为错误。为解决这一行业痛点&#xff0c;翔云人工智能开放平台积极探索金融科技应用&#xff0c;提供了发票查验接口&#xff0c;实现发票信息…

全网唯一:触摸精灵iOS版纯离线本地文字识别插件

目的 触摸精灵iOS是一款可以模拟鼠标和键盘操作的自动化工具。它可以帮助用户自动完成一些重复的、繁琐的任务&#xff0c;节省大量人工操作的时间。但触摸精灵的图色功能比较单一&#xff0c;无法识别屏幕上的图像&#xff0c;根据图像的变化自动执行相应的操作。本篇文章主要…

【TB作品】msp430f5529单片机墨水屏,口袋板,显示温度和万年历,tmp421温度,RTC时间

文章目录 一、部分程序二、展示三、全部代码下载 一、部分程序 int main(void) {WDTCTL WDTPW | WDTHOLD; //关闭看门狗init(); //屏幕初始化InitIIC(); //I2C初始化TMP_Init(); //tmp421初始化SetupRTC();_EINT();while (1){} }#pragma vectorRT…

ES升级--04--SpringBoot整合Elasticsearch

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 SpringBoot整合Elasticsearch1.建立项目2.Maven 依赖[ES 官方网站&#xff1a;https://www.elastic.co/guide/en/elasticsearch/client/java-rest/6.8/index.html](…

Leetcode:整数反转

题目链接&#xff1a;7. 整数反转 - 力扣&#xff08;LeetCode&#xff09; 普通版本&#xff08;翻转字符串&#xff09; class Solution { public:int reverse(int x) {//将整数变成字符串string sto_string(x);int flag0;//flag用于标识原来的整数是否为负//去掉负号if(s[…

Go 语言中基础数据类型、运算符、类型转换与类型别名

在编程语言中&#xff0c;数据类型是程序设计的基石&#xff0c;它们决定了变量的存储方式、允许的操作以及运算结果。在 Go 语言中&#xff0c;数据类型丰富而灵活&#xff0c;提供了强大的工具来处理各种数据和运算需求。无论是简单的布尔值、整型和浮点型&#xff0c;还是复…

Wireshark Lua插件入门

摘要 开发中经常通过抓包分析协议&#xff0c;对于常见的协议如 DNS wireshark 支持自动解析&#xff0c;便于人类的理解&#xff0c;对于一些私有协议&#xff0c;wireshark 提供了插件的方式自定义解析逻辑。 1 动手 废话少说&#xff0c;直接上手。 第一步当然是装上wiresh…

RUST运算符重载

在 Rust 中&#xff0c;可以使用特征&#xff08;traits&#xff09;来实现运算符重载。运算符重载是通过实现相应的运算符特征&#xff08;如 Add、Sub、Mul 等&#xff09;来完成的。这些特征定义在 std::ops 模块中。下面是一个简单的示例&#xff0c;展示如何为一个自定义结…

人工智能学习笔记(2):认识和安装Stable Diffusion

人工智能学习笔记&#xff08;2&#xff09;&#xff1a;认识和安装Stable Diffusion 文章目录 人工智能学习笔记&#xff08;2&#xff09;&#xff1a;认识和安装Stable DiffusionStable Diffusion的起源和发展历程Stable Diffusion的应用场景基本原理文本到图像的转换过程潜…

KIBANA的安装教程(超详细)

前言 Kibana 是一个开源的基于浏览器的可视化工具&#xff0c;主要用于分析和展示存储在 Elasticsearch 索引中的数据。它允许用户通过各种图表、地图和其他可视化形式来探索和理解大量数据。Kibana 与 Elasticsearch 和 Logstash 紧密集成&#xff0c;共同构成了所谓的 ELK 堆…