• 当前标签:模拟鼠标事件

程序开发 JavaScript 模拟鼠标事件

div{     width: 300px;     height: 50px;     background-color: red;     color: white; } <body>     <div>         这个DIV可以点击 <br>         点击键盘时会虚拟一个鼠标点击事件     </div>     <script>         var div =document.querySelector('div')         window.onkeypress =function(e){             var mouseEvent =document.createEvent('MouseEvent')             mouseEvent.initMouseEvent('click',true,true,document.defaultView,1,2,3,4,5,6,7,8)             // document.defaultView 属性可以获取指定文档所在窗口             // var mouseEvent = new MouseEvent('click11',{             //     bubbles:true,             //     cancelable:true,             //     ctrlKey:true,             //     button:1,             //     buttons:1,             //     clientX:12,             //     clientY:13,             //     offsetX:12,             //     offsetY:14,             // })             div.dispatchEvent(mouseEvent)         }         div.addEventListener('click',function(e){             alert('你点击了DIV:' + e.pageX)             alert(e.ctrlKey?'ctrl被按下':'ctrl没有被按下')         })         // 可以模拟任意事件 通过模拟事件可以欺骗代码          // 让代码认为真的发生了一个事件         // 模拟事件的方法:         // 1 创建相应的事件 如鼠标事件的mouseEvent         // 2 初始化事件 可以虚拟各种数据(参考MDN文档)         // 3 使用dispatchEvent派发事件给指定元素     </script> </body>

2017-07-22 09:11:12 33 0 0
阅读详情
  • 1
前往