网页端没有直接的api可以实现鼠标点击,移动等操作。

我目前的思路是,自己创建点击,移动等事件,然后通过元素的dispatchEvent方法,直接把事件发给目标元素。但是这种方式非常麻烦,需要先找到监听鼠标操作的元素,然后才能用dispatchEvent方法,没有通用性,有没有更好的思路或方法。

三种操作的封装function creatpointerdown(x, y, offsetX, offsetY) {

let downEvent = new PointerEvent("pointerdown", {

pointerId: 1,

bubbles: true, //如果事件是冒泡类型,则返回 true,否则返回 fasle。

button: 0, // 按下 0(通常是左按钮) 移动时为-1

buttons: 1, // pointerdown 1(通常是左键) pointerup时候为 0(没有键被按下)

cancelable: true, //如果用 preventDefault() 方法可以取消与事件关联的默认动作,则为 true,否则为 fasle。

composed: true, //用来指示该事件是否可以从 Shadow DOM 传递到一般的 DOM。

pointerType: "mouse",

which: 1, //按下和抬起为1 移动时为0

width: 1, //触摸的物体,与屏幕接触的面积

height: 1, //触摸的物体,与屏幕接触的面积

isPrimary: true, //是否为主指针

isTrusted: true, //是否可信任 判断是脚本操作还是真人操作 ,其实并不能设置,脚本操作则为false

tiltX: 0, //Y和Z轴的角度 -90到90度

tiltY: 0,

view: document.defaultView, //与事件关联的窗口

clientX: x,

clientY: y,

screenX: x, //鼠标在屏幕上的x坐标

screenY: y + 71, //鼠标在屏幕上的y坐标

movementX: 0,

movementY: 0,

pressure: 0.5 //压力 鼠标点击时为 0.5 鼠标按下为抬起移动时为0 抬起了移动时为0

});

return downEvent;

}

//按下时移动

function creatpointermove(x, y, offsetX, offsetY) {

let moveEvent = new PointerEvent("pointermove", {

pointerId: 1,

bubbles: true, //如果事件是冒泡类型,则返回 true,否则返回 fasle。

button: -1, // 按下 0(通常是左按钮) 移动时为-1

buttons: 1, // pointerdown 1(通常是左键) pointerup时候为 0(没有键被按下)

cancelable: true, //如果用 preventDefault() 方法可以取消与事件关联的默认动作,则为 true,否则为 fasle。

composed: true, //用来指示该事件是否可以从 Shadow DOM 传递到一般的 DOM。

pointerType: "mouse",

which: 0, //按下和抬起为1 移动时为0

width: 1, //触摸的物体,与屏幕接触的面积

height: 1, //触摸的物体,与屏幕接触的面积

isPrimary: true,

tiltX: 0,

tiltY: 0,

view: document.defaultView, //与事件关联的窗口

clientX: x,

clientY: y,

screenX: x, //鼠标在屏幕上的x坐标

screenY: y + 71, //鼠标在屏幕上的y坐标

movementX: offsetX,

movementY: offsetY,

pressure: 0.5 //压力 鼠标点击时为 0.5 鼠标按下为抬起移动时为0 抬起了移动时为0 抬起时为0

});

return moveEvent;

}

function creatpointerup(x, y, offsetX, offsetY) {

let upEvent = new PointerEvent("pointerup", {

pointerId: 1,

bubbles: true, //如果事件是冒泡类型,则返回 true,否则返回 fasle。

button: -1, // 按下 0(通常是左按钮) 移动时为-1

buttons: 0, // pointerdown 1(通常是左键) pointerup时候为 0(没有键被按下)

cancelable: true, //如果用 preventDefault() 方法可以取消与事件关联的默认动作,则为 true,否则为 fasle。

composed: true, //用来指示该事件是否可以从 Shadow DOM 传递到一般的 DOM。

pointerType: "mouse",

which: 1, //按下和抬起为1 移动时为0

width: 1, //触摸的物体,与屏幕接触的面积

height: 1, //触摸的物体,与屏幕接触的面积

isPrimary: true,

tiltX: 0,

tiltY: 0,

view: document.defaultView, //与事件关联的窗口

clientX: x,

clientY: y,

screenX: x, //鼠标在屏幕上的x坐标

screenY: y + 71, //鼠标在屏幕上的y坐标

movementX: offsetX,

movementY: offsetY,

pressure: 0 //压力 鼠标点击时为 0.5 鼠标按下为抬起移动时为0 抬起了移动时为0 抬起时为0

});

return upEvent;

}

html 模拟鼠标移动,如何在网页端用js模拟鼠标移动点击等操作相关推荐

  1. 网页端基于js的图片裁剪

    效果预览 点击下载前往码云下载相应js 使用说明 CDN 使用 <script src="croptool.min.js"></script> <sc ...

  2. 帮助中心 html页面,网页端直播

    开始网页直播前,系统会自动检测摄像头.麦克风等设备的可用性,检测正常后,点击[去直播],开始网页直播. (一)网页端直播界面 (二)上课/下课 点击 ,将开始课堂直播. 点击 ,将结束课堂直播. (三 ...

  3. bilibili 网页端如何关灯和开灯?

    我不小心按到了关灯模式过了好久都没找到关灯的地方体验极差. 下面给出解决方法: 1.首先点击网页端右边的音量键 2. 点击弹出的框里的更多播放设置 3. 点击关灯模式

  4. js判断鼠标位置是否在某个div中

    div的onmouseout事件让div消失时,会出现这样的情况,就是当鼠标移至div中的其它内容时,此时也判定为离开div,会触发 onmouseout事件,这样div中的内容就不能操作了.解决的办 ...

  5. html判断坐标,js判断鼠标位置是否在某个div中的方法

    本文实例讲述了js判断鼠标位置是否在某个div中的方法.分享给大家供大家参考,具体如下: div的onmouseout事件让div消失时,会出现这样的情况,就是当鼠标移至div中的其它内容时,此时也判 ...

  6. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题...

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  7. Chrome自动运行Js去广告,利用插件网页自动运行Js脚本,油猴去广告教程【去处指定部位的广告】

    免自写代码去除广告,点击即可安装:点此去向去除广告的油猴脚本 -------以下是教学如何自己写油猴脚本删除指定广告的------ 目的页面:https://m.dmzj.com/view/33353 ...

  8. 网页游戏python_请问用Python能否做网页游戏的后台模拟鼠标类的脚本么?

    后台模拟键盘的话需要修改内存,但是我做的是有关地下城的脚本,加上要图像识别的,所以只能在桌面模拟输入输出. 对于python来说,模拟键盘的方式据我了解有三种方式,其中有pyuserinput,win ...

  9. [干货]网页端、移动端导航设计模式全解

    界面中的组件设计有很多通用的交互设计模式. 产品导航做为界面上最常见的组件同样也有多种被大家熟知的设计模式,模式化的组件为产品经理快速.有效的创建产品界面.构建信息架构提供的方便的应用. 接下来,我们 ...

  10. 网页端、移动端导航设计模式全解

    ​界面中的组件设计有很多通用的交互设计模式. 产品导航做为界面上最常见的组件同样也有多种被大家熟知的设计模式,模式化的组件为产品经理快速.有效的创建产品界面.构建信息架构提供的方便的应用. 接下来,我 ...

最新文章

  1. Java课程寒假之开发记账本软件(网页版)之二
  2. javascript worker 多线程 简单示例
  3. MySQL DDL--MySQL 5.7版本Online DDL操作
  4. hapi返回xml格式 微信开发 node
  5. [ ZJOI 2012 ] 灾难
  6. python回车换行怎么不行_使用Python编写换行符时避免写入回车'\r'
  7. C++结构体作为函数参数传参
  8. 计算机网络之网络层:6、IPv6
  9. 流式大数据计算实践(4)----HBase安装
  10. 002.AngularJs调用Restful实现CRUD
  11. data 谷歌浏览器更改user 路径_安卓微信 7.0.13.2开启众测邀请,数据存储路径迁移...
  12. 三位数除以两位数竖式计算没有余数_北京版二年级数学下册第一单元有余数的除法练习题【都有电子版】...
  13. SogouLabDic搜狗词库
  14. 虚拟机怎么制作镜像文件
  15. CSS控制多行文本省略--显示省略号
  16. flowchart.js使用总结
  17. win10无法安装完成若要在此计算机上,win10提示windows安装无法继续怎么办
  18. Windows Server 2012 如何实现多个用户远程桌面登陆?
  19. 【免费域名】教你免费申请顶级域名
  20. flash设置屏保 html,用Flash制作屏保-FlashWiz

热门文章

  1. 韩立刚Linux基础入门,Linux入门基础笔记1(韩立刚课程)(示例代码)
  2. 数值计算之 梯度向量和梯度矩阵,雅可比矩阵,海森矩阵
  3. 刚做微商引流太慢怎么办?微商没有客源怎么办,微商引流需要注意什么
  4. 服务器内存傲腾基本参数信息,单条512GB的傲腾内存你见过嘛?
  5. Java、JSP公文流转系统
  6. hadoop实现单词统计
  7. ORA-01033问题:定位redo日志进行不完全恢复启库实战案例
  8. macOS安装brew和ffmpeg下载m3u8
  9. Android改机 安卓改机软件 免root/不刷机/拒绝Xposed 实现 技术分析
  10. 海康威视rtsp转rtmp(java稳定版)