JavaScript 模拟鼠标事件

<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>

发送评论编辑评论

发送评论 编辑评论