Question

我用这样的设计模式创建了某种JavaScript对象：

var MyObject = (function(){

    var element;
    var config = {
        // Defaults...
    };

    function initialize(id, options){
        element = $(id);
        config = $.extend(config, options);
    }

    function method(){
        // Some code...
    }

    element.on('click', function(){
        // Some actions when clicked on element...
    });

    return {
        initialize: initialize,
        // Other public methods...
    };

})();

这就是对象的初始化方式：

MyObject.initialize('#someId');

当我尝试为element添加一些事件时，脚本效果很好，但是会发生错误。正如我所知，匿名函数(function(){ ... })();是立即执行的，但变量element的初始化是在它之后发生的。

那么，我该如何为这个JavaScript对象模式实现一个事件处理呢？

谢谢！

Answer 1

您应该在on函数中调用initialize。由于外部函数正在立即执行（正如您自己实现的那样），element为undefined。因此，在定义变量之后，您应该只在其上调用on：

function initialize(id, options){
    element = $(id);
    element.on('click', function() {
        ...
    });   

    config = $.extend(config, options);
}

Answer 2

坚持使用初始化方法。

function initialize(id, options){
    element = $(id);
    config = $.extend(config, options);


    element.on('click', function(){
        // Some actions when clicked on element...
    });
}

JavaScript对象中的事件处理

2 个答案: