编写可维护的JavaScript之事件处理

规则1:隔离应用逻辑

    这会让你的代码容易调试

规则2:不要分发事件对象

    event对象包含了太多信息

// a good example
var handlePopup = {

    // 事件句柄,处理所有和event对象有关的东西
    handleClick: function (e) {
 
        // 假设事件支持DOM Level2
        e.preventDefault();
        e.stopPropagation();

        // 传入应用逻辑
        this.showPopup(e.clientX, e.clientY);
    },

    // 应用逻辑,独立于事件、
    showPopup: function(x, y) {
        var popup = document.getElementById("popup");
        popup.style.left = x + "px";
        popup.style.top = y + "px";
    }
};

addListener(element, "click", function(e) {
    handlePopup.handleClick(e);
});

 

posted @ 2014-05-27 22:23  farawayfromhome  阅读(269)  评论(2编辑  收藏  举报