JavaScript 模拟鼠标事件

黄良钵

分类: 程序开发 736 0

  1. div{
  2.     width300px;
  3.     height50px;
  4.     background-colorred;
  5.     colorwhite;
  6. }
  1. <body>
  2.     <div>
  3.         这个DIV可以点击 <br>
  4.         点击键盘时会虚拟一个鼠标点击事件
  5.     </div>
  6.     <script>
  7.         var div =document.querySelector('div')
  8.         window.onkeypress =function(e){
  9.             var mouseEvent =document.createEvent('MouseEvent')
  10.             mouseEvent.initMouseEvent('click',true,true,document.defaultView,1,2,3,4,5,6,7,8)
  11.             // document.defaultView 属性可以获取指定文档所在窗口
  12.             // var mouseEvent = new MouseEvent('click11',{
  13.             //     bubbles:true,
  14.             //     cancelable:true,
  15.             //     ctrlKey:true,
  16.             //     button:1,
  17.             //     buttons:1,
  18.             //     clientX:12,
  19.             //     clientY:13,
  20.             //     offsetX:12,
  21.             //     offsetY:14,
  22.             // })
  23.             div.dispatchEvent(mouseEvent)
  24.         }
  25.         div.addEventListener('click',function(e){
  26.             alert('你点击了DIV:' + e.pageX)
  27.             alert(e.ctrlKey?'ctrl被按下':'ctrl没有被按下')
  28.         })
  29.         // 可以模拟任意事件 通过模拟事件可以欺骗代码 
  30.         // 让代码认为真的发生了一个事件
  31.         // 模拟事件的方法:
  32.         // 1 创建相应的事件 如鼠标事件的mouseEvent
  33.         // 2 初始化事件 可以虚拟各种数据(参考MDN文档)
  34.         // 3 使用dispatchEvent派发事件给指定元素
  35.     </script>
  36. </body>
  • 0人 Love
  • 0人 Haha
  • 0人 Wow
  • 0人 Sad
  • 0人 Angry
JavaScript、模拟鼠标事件

作者简介: 黄良钵

打赏

博客站长,前端开发工程师

共 0 条评论关于 “JavaScript 模拟鼠标事件”

Loading...