前端js点击事件怎么取消捕获
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了前端js点击事件怎么取消捕获相关的知识，希望对你有一定的参考价值。
参考技术A 如果是通过window.onclick = function()监听的话可以通过window.onclick = undefined 取消监听；如果是通过window.addEventListener('click', function())监听则可以通过window.removeEventListener('click')取消监听。
js获取鼠标点击事件的相对位置
如图
我需要获取图片上点击事件相对于图片左上方原点(0,0)的位置，最好要能考虑到滚动条的影响的，谢谢了~
<head>
<title>位置</title>
<script language="javascript" type="text/javascript">
function m()
document.getElementById("area").innerHTML=event.clientX +" , "+event.clientY;
function c()
var objTop = getOffsetTop(document.getElementById("d"));//对象x位置
var objLeft = getOffsetLeft(document.getElementById("d"));//对象y位置
var mouseX = event.clientX+document.body.scrollLeft;//鼠标x位置
var mouseY = event.clientY+document.body.scrollTop;//鼠标y位置
//计算点击的相对位置
var objX = mouseX-objLeft;
var objY = mouseY-objTop;
clickObjPosition = objX + "," + objY;
alert(clickObjPosition);
function getOffsetTop(obj)
var tmp = obj.offsetTop;
var val = obj.offsetParent;
while(val != null)
tmp += val.offsetTop;
val = val.offsetParent;
return tmp;
function getOffsetLeft(obj)
var tmp = obj.offsetLeft;
var val = obj.offsetParent;
while(val != null)
tmp += val.offsetLeft;
val = val.offsetParent;
return tmp;
</script>
</head>
<body style="margin:0px;" onmousemove="m();">
<div style="padding:90px;border:1px solid #ccc;font-size:36px;width:800px;height:800px;"> </div>
<div id="area"></div>
<div style="width:1400px;height:300px;border:1px solid red;padding-left:1200px;">
<div id="d" style="width:200px;height:200px;border:1px solid green;padding:10px;cursor:hand;" onclick="c()">这里是图片，因为我用div边框1px，所以两个div会有2px的位置偏移，你可以自己调整</div>
</div>
</body>
</html>
现写的，你可以copy下来创建个html自己研究下，不难 参考技术A
常用的是 event.clientX和event.clientY分别获取横向的和纵向的位置，但仅使用这个方法是不够的，因为event.clientX和event.clientY获取的鼠标位置是相对于当前屏幕的，而不考虑页面的滚动条所滚动的距离。
function pointerX(event)return event.pageX || (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));
function pointerY(event)
return event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop));
以上是关于前端js点击事件怎么取消捕获的主要内容，如果未能解决你的问题，请参考以下文章