1. 程式人生 > >js 相容性之阻止事件冒泡傳遞

js 相容性之阻止事件冒泡傳遞

有時候在document.onclick上綁定了事件,但在單擊某些地方的時候不希望觸發document上的click事件,則可以在方法裡阻止其事件的冒泡,例如:

var btn = document.getElementById("btn");

btn.onclick=function(event){

      alert('clicked');

      event.stopPropagation();

}

document.body.onclick = function(event){

      alert('body clicked');

}

有了event.stopPropagation();方法,就可以使在點選按鈕時不觸發下面的body.click事件。

在IE下不支援此方法,但可以利用其event.cancelBubble屬性設定為true阻止。綜上所述,例如:

var btn = document.getElementById("btn");

btn.onclick=function(event){

      alert('clicked');

      if(event.stopPropagation)

         event.stopPropagation();

      else

         event.cancelBubble = true;

}

以上程式碼可以相容的解決此問題。