js添加事件、移除事件、阻止冒泡、阻止瀏覽器默認行爲等寫法(兼容IE/FF/CHROME)



添加事件

var addEvent = function( obj, type, fn ) {
  if (obj.addEventListener)
      obj.addEventListener( type, fn, false );
  else if (obj.attachEvent) {
      obj["e"+type+fn] = fn;
      obj.attachEvent( "on"+type, function() {
          obj["e"+type+fn].call(obj, window.event);
      } );
  }
};

移除事件

var removeEvent = function( obj, type, fn ) {
  if (obj.removeEventListener)
      obj.removeEventListener( type, fn, false );
  else if (obj.detachEvent) {
      obj.detachEvent(  "on" +type, obj["e"+type+fn] );
      obj["e"+type+fn] = null;
  }
};

阻止事件(包括冒泡和默認行爲)

var stopEvent = function(e){
    e = e || window.event;
    if(e.preventDefault) {
      e.preventDefault();
      e.stopPropagation();
    }else{
      e.returnValue = false;
      e.cancelBubble = true;
    }
  },

僅阻止事件冒泡

var stopPropagation = function(e) {
   e = e || window.event;
  if (!+"\v1″) {
     e.cancelBubble = true;
  } else {
     e.stopPropagation();
  }
}

僅阻止瀏覽器默認行爲

var  preventDefault  = function(e) {
    e = e || window.event;
    if(e.preventDefault) {
      e.preventDefault();
    }else{
      e.returnValue = false;
    }
}

取得事件源對象

var getEventTarget = function(e){
   e = e || window.event;
  var target = event.srcElement ? event.srcElement : event.target;
  return target;
}

附：綁定onpropertychange事件

onpropertychange，它在一個元素的屬性發生變化的時候觸發，一般用在表單元素中捕獲其value值改變，它比onchange事件更實時捕獲它的改變，不過爲微軟私有事件。FF大致和它相似的有oninput事件，不過它只針對textfield與textarea的value屬性。safari，firefox，chrome與 opera都支持此事件。

var addPropertyChangeEvent = function (obj,fn) {
  if(window.ActiveXObject){
      obj.onpropertychange = fn;
  }else{
      obj.addEventListener("input",fn,false);
  }
}