js事件监听-addEventListener (w3c标准) 和 attachEvent（ie）

研究了一个小时，没看懂这两个属性

window.onload = function(){   var oDiv = document.getElementById("J_myDiv"); //找到对象   oDiv.onclick = function(){                     //设置事件监听函数        alert("click");   }}

缺点：1.添加单一事件

2.不能删除事件

第二：IE中监听函数

var oDiv;

function fnClick(){    alert("click me");    oDiv.detachEvent("onclick",fnClick);//删除监听函数}

window.onload = function(){   oDiv = document.getElementById("J_myDiv");//找到对象   oDiv.attachEvent("onclick",fnClick);       //添加监听函数}

第三：标准DOM监听函数

var oDiv;

function fnClick1(){   alert("click1");   // oDiv.removeEventListener("click",fnClick2,false); //删除监听函数2}

function fnClick2(){   alert("click2");}

window.onload = function(){

     oDiv = document.getElementById("J_myDiv"); //找到对象     oDiv.addEventListener("click",fnClick1,false);   //添加监听函数1     oDiv.addEventListener("click",fnClick2,false);   //添加监听函数2

}

第四：从js实例来看事件监听 参看：http://imethan.com/?p=208

第五：从实例来看JS的事件监听学习笔记（事件监听绑定、ff/IE不同的处理机制兼容总结)参看：http://hi.baidu.com/dou917/blog/item/40219f37e6e3deee1b4cff67.html

第六：代码总结

<script language="javascript">//Javascript 事件演示window.onload = function(){    var hideBox = function(event){        document.getElementById(‘status_show‘).style.display = ‘none‘;        document.getElementById(‘status_hide‘).style.display = ‘block‘;    };    var showBox = function(event){        document.getElementById(‘status_show‘).style.display = ‘block‘;        document.getElementById(‘status_hide‘).style.display = ‘none‘;        stopEvent(event);    };    var stopEvent = function(event){        e = event || window.event;        if(e.stopPropagation){            e.stopPropagation();        }else {            e.cancelBubble = true;        }    };    if(document.addEventListener){        document.addEventListener(‘click‘, hideBox, false);        document.getElementById(‘status_hide‘).addEventListener(‘click‘, showBox, false);        document.getElementById(‘status_show‘).addEventListener(‘click‘, stopEvent, false);    }else {        //For IE        document.attachEvent(‘onclick‘, hideBox);        document.getElementById(‘status_hide‘).attachEvent(‘onclick‘, showBox);        document.getElementById(‘status_show‘).attachEvent(‘onclick‘, stopEvent, showBox);    }};</script>