兼容性

备注

过时的，不用在考虑 IE 了。

阻止事件冒泡

function stopPropagation(event) {
  if (event.stopPropagation) {
    event.stopPropagation(); // ✅
  } else {
    event.cancelBubble = true; // ie
  }
}

阻止默认事件

function preventDefault(event) {
  if (event.stopPropagation) {
    event.preventDefault(); // ✅
  } else {
    event.returnValue = true; // ie
  }
}

target

function target(event) {
  return event.target || event.srcElement;
}

绑定事件

function addEventListener(target, type, func) {
  if (target.addEventListener) {
    target.addEventListener(type, func, false); // ✅
  } else if (target.attachEvent) {
    target.attachEvent("on" + type, func); // ie6到ie8
  } else {
    target["on" + type] = func; // ie5
  }
}

删除事件

function removeEventListener(target, type, func) {
  if (target.removeEventListener) {
    target.removeEventListener(type, func, false); // ✅
  } else if (target.detachEvent) {
    target.detachEvent("on" + type, func); // ie6到ie8
  } else {
    target["on" + type] = null; // ie5
  }
}

鼠标单击

IE 认为：左键为 1，右键为 2，中键（滚轮按下）为 4。 FF 认为：左键为 0，右键为 2，中键（滚轮按下）为 1。

鼠标滚动事件

function addMousewheel(target, type, func) {
  let wheelTimer = 0;

  function getWheelDelta(event: any) {
    return event.wheelDelta ? -event.wheelDelta / 120 : event.detail / 3;
  }

  // ✅
  this.addEvent(obj, "DOMMouseScroll", function (event: any) {
    callback(getWheelDelta(event));
  });

  // IE
  this.addEvent(obj, "mousewheel", (event: any) => {
    clearTimeout(wheelTimer);
    if (event.deltaY > 0) {
      wheelTimer = setTimeout(function () {
        callback(getWheelDelta(event));
      }, 100);
    } else if (event.deltaY < 0) {
      wheelTimer = setTimeout(function () {
        callback(getWheelDelta(event));
      }, 100);
    }
  });
}

鼠标点击坐标

event.x, event.y[IE] event.pageX,event.pageY[Moz]

鼠标点击的相对位置

IE 中取鼠标点击的相对位置，使用 event 对象的 event.offsetX 和 event.offsetY Moz 中取鼠标点击的相对位置，使用 event 对象的 event.layerX 和 event.layerY

键盘 key 值

event.keyCode 和 event.which