鼠标单击显示NULL值的x和y线 - onclick事件处理

时间:2017-02-22 01:51:16

标签: javascript onclick event-handling

尝试显示鼠标单击的x和y值。问题:我总是得到0,0。我认为脚本没有检测到属性event.currentTarget

第一个函数计算父元素的相对值并减去I.E.填充,边框和滚动。

// get the position of click - 
function getPosition(el) {
  var xPosition = 0;
  var yPosition = 0;
 
  while (el) {
    if (el.nodeName == "BODY") {
      // deal with browser quirks with body/window/document and page scroll
      var xScrollPos = el.scrollLeft || document.documentElement.scrollLeft;
      var yScrollPos = el.scrollTop || document.documentElement.scrollTop;
 
      xPosition += (el.offsetLeft - xScrollPos + el.clientLeft);
      yPosition += (el.offsetTop - yScrollPos + el.clientTop);
    } else {
      xPosition += (el.offsetLeft - el.scrollLeft + el.clientLeft);
      yPosition += (el.offsetTop - el.scrollTop + el.clientTop);
    }
 
    el = el.offsetParent;
  }
  return {
    x: xPosition,
    y: yPosition,
    a: "hahah",
  };
}

// Set up event handlers according to standards
window.addEventListener("load", function(){
  document.addEventListener("click", handleClick);
});

function handleClick(event, x, y) {
    var el = event.CurrentTarget;
    posOb = getPosition(event.CurrentTarget);
 alert("x:" + posOb.x + ", y:" + posOb.y);
}

0 个答案:

没有答案