创建一个 jQuery 容器来容纳其他功能

Question

我正在尝试创建一个简单的 class 或一个容器来容纳几个 JavaScript 方法，如下所示。

var Core = (function () {

    var Error = {
        alert: function() {
            alert('Error => alert called');
        },
        display: function() {
            alert('Error => display called');
        }
    };

    var ajax = {
        view: function(){
            alert('Ajax => view called');
        },
        update: function(){
            alert('Ajax => update called');
        }
    };

    var call = function(){
        Error.alert();
        Error.display();
        ajax.view();
        ajax.update();
    };

    $(document).ready(function(){
       call(); // This works fine.
    }());

但出于某种原因，我无法在容器外调用这些方法。例如调用如下所示的函数会抛出错误。

$(document).ready(function(){
    Core.Error.alert(); // This doesn't work.
    Core.Call(); // This doesn't work.

});

错误：未捕获类型错误：无法读取未定义的属性'Error'

我可以从容器中调用函数。我是 jQuery 插件概念的新手，如果有人能帮助我，我将不胜感激。

Answer 1

您可以导出这些方法（阅读更多关于 Module Pattern 的信息），就像这样

var Core = (function () {
  ...

  return {
    Error: Error,
    Ajax: ajax,
    Call: call
  };
})();

Core.Error.alert();
Core.Call();

Example

Answer 2

更改为：

var Core = {     
    error: {
        alert: function () {
            alert('Error => alert called');
        },
        display: function () {
            alert('Error => display called');
        }
    }, 

    ajax: {
        view: function () {
            alert('Ajax => view called');
        },
        update: function () {
            alert('Ajax => update called');
        }
    }, 

    call: function () {
        Core.error.alert();
        Core.error.display();
        Core.ajax.view();
        Core.ajax.update();
    }
}

$(document).ready(function () {
    Core.call(); // This works
}());

Working fiddle

创建一个 jQuery 容器来容纳其他功能

Creating a jQuery container to hold other functions

javascript

jquery

jquery-plugins