• 欢迎访问杨思积的博客,专注于前端资讯分享,前端技术交流!

JS模拟鼠标点击坐标

精选代码 Tomy 371次浏览 已收录 0个评论 扫描二维码
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
	#div1{
		position: absolute;
		width: 200px;
		height: 200px;
		background-color: red;
		color:white;
		text-align: center;
    	line-height: 200px;
	}
	#div2{
		position: absolute;
		left: 300px;
		width: 200px;
		height: 200px;
		background-color: blue;
		color:white;
	    text-align: center;
    	line-height: 200px;
	}
	</style>
</head>
<body>
	<div id="div1">区域1</div>
	<div id="div2">区域2</div>
  <script>
	function imitateClick(oElement, iClientX, iClientY) {  	//定义模拟点击事件
        var oEvent;
        oEvent = document.createEvent("MouseEvents");
        oEvent.initMouseEvent("click", true, true, document.defaultView, 0, 0, 0,
                                iClientX, iClientY/*, false, false, false, false, 0, null*/);
        oElement.dispatchEvent(oEvent);
    }
    var div1 = document.getElementById('div1');	//区域1
    var div2 = document.getElementById('div2');	//区域2
    div1.onclick = function(event) {  //区域1点击方法
        alert("点击区域1 (" + event.clientX + "," + event.clientY + ")");
    };
    div2.onclick = function(event) {  //区域2点击方法
        alert("点击区域2 (" + event.clientX + "," + event.clientY + ")");
    };
    imitateClick(div1, 100, 100);  //触发模拟点击div1(100,100)的坐标
  </script>
</body>
</html>

代码演示
杨思积的博客 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权 , 转载请注明JS模拟鼠标点击坐标
喜欢 (0)
[嘿嘿,你懂的]
分享 (0)
Tomy
关于作者:
一个前端爱好者!
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址