插件之间的依赖关系？在创建插件之前调用方法答案

【问题标题】：Dependency between plugins? Calling a method before plugin is created插件之间的依赖关系？在创建插件之前调用方法
【发布时间】：2013-09-02 06:03:02
【问题描述】：

我有 2 个插件，其中 1 个始终存在，另一个不存在。在插件 2 的初始化过程中，我尝试从插件 1 访问设置变量，但由于尚未创建插件 1（加载顺序），因此出现错误。即：

;(function$) {
    $.plugin2 = function(el, options) {
        ...
        ...
        var init = function() {
        plugin.settings = $.extend({}, defaults, options);
        plugin.el = el;

        var init = function() {
            ...plugin1Instance.settings.variable... <--------
        }

        init();
    };
});

宁愿不使用 timeOut 方法，想知道什么是最干净的方法。

【问题讨论】：

标签： javascript jquery plugins jquery-plugins dom-events

【解决方案1】：

我以这种方式加载插件。愿它对某人有用。

在全局部分定义数组

var plugins = [];

像往常一样加载我所有的插件 (*.js)，<script type="text/javascript" src="pluginX.js"></script>

每个 pluginX.js 都将他的 init() 函数添加到插件数组中。

并通过插件数组加载文档正文事件处理程序并调用每个添加的函数。

所以，我们等到文档加载完所有脚本，然后继续。

全局部分的代码：

var plugins = [];

function startOnLoad() {
   // Start init() of every 'registered; plugin
   for (var i = 0; plugins.length - 1; i++) {
      plugins[i]();
   }

   // Ok, all plugins initialized, can access each other.
   // Ex: plugin1Instance.settings.variable and etc.
}

在每个pluginX.js 一个结尾：

plugins.push(Plugin1.init);

PS：在插件数组定义的部分之后加载插件。

【讨论】：

【解决方案2】：

如果您的插件被放置在外部文件中，那么监听 onload 事件就足够了：

var windowOnLoad = function() {
    // your plugins should be loaded at the moment
}
if (window.addEventListener) {
    window.addEventListener('load', windowOnLoad, false);
} else if (window.attachEvent) {
    window.attachEvent('onload', windowOnLoad);
}

如果由于某种原因这不起作用，您应该编辑您的插件并在它们初始化后收到通知。

var totalPlugins = 2;
var numberOfLoadedPlugins = 0;
var pluginLoaded = function() {
    numberOfLoadedPlugins += 1;
    if(numberOfLoadedPlugins === totalPlugins) {
        // it's done. your plugins are loaded
        // proceed with the other logic
    }
}

;(function$) {
    $.plugin1 = function(el, options) {
        // ...
    };
    pluginLoaded();
});
;(function$) {
    $.plugin2 = function(el, options) {
        // ...
    };
    pluginLoaded();
});

您应该找到应用程序的入口点并停在那里，等待插件加载并继续。

【讨论】：