HTML事件处理程序

事件处理程序中的代码执行时，有权访问全局作用域中任何代码。

 

 //为按钮btn_event添加了两个个事件处理程序，而且该事件会在冒泡阶段触发（最后一个参数是false）。
        var btn_event = document.getElementById("btn_event");
        var handler = function () {
            alert(this.id);
        };
        var handler2 = function () {
            alert("hello longdb");
        };
        btn_event.addEventListener("click", handler, false);
        btn_event.addEventListener("click", handler2, false);

        //移出第二个事件处理程序。
        btn_event.removeEventListener("click", handler2, false);//第二个参数传入handler2函数才有效。

 IE事件处理程序：

   //移出第二个事件处理程序。
        btn_event.removeEventListener("click", handler2, false);//第二个参数传入handler2函数才有效。

        // IE事件处理程序。IE实现了与DOM中类似的两个方法：
        //执行顺序与DOM的addEventListener相反。
        btn_event.attachEvent("onclick", handler);
        btn_event.attachEvent("onclick", handler2);

        //移出第一个事件处理程序。
        btn_event.detachEvent("onclick",handler);

 

垮浏览器事件处理程序：

   //垮浏览器的事件处理程序。
        var EventUtil = {
            addHandler: function (element, type, handler) {
                if (element.addEventListener) {
                    element.addEventListener(type, handler, false);
                }
                else if (element.attachEvent) {
                    element.attachEvent("on" + type, handler);
                }
                else {
                    element["on" + type] = handler;
                }
            },
            removeEventListener: function (element, type, handler) {
                if (element.removeEventListener) {
                    element.removeEventListener(type, handler, false);
                }
                else if (element.detachEvent) {
                    element.detachEvent("on" + type, handler);
                }
                else {
                    element["on" + type] = null;
                }
            }
            ,
            getEvent: function (event){
                return event ? event : window.event;
            }
            ,
            getTarget: function (event){
                return event.target || event.srcElement;
            }
            ,
            preventDefault: function (event) {
                if (event.preventDefault) {
                    return event.preventDefault;
                }
                else {
                    return event.returnValue = false;
                }
            }
        };

        //这样利用上面的对象。
        EventUtil.addHandler(btn_event, "click", handler);
        EventUtil.addHandler(btn_event, "click", handler2);
        EventUtil.removeEventListener(btn_event, "click", handler2);//移出handler2事件处理程序。