从 DOMcontentLoaded 范围内加载函数答案

【问题标题】：Load function from within DOMcontentLoaded scope从 DOMcontentLoaded 范围内加载函数
【发布时间】：2015-12-23 19:07:01
【问题描述】：

jsfiddle

https://jsfiddle.net/ee7oe5pb/2/

Javascript

var events = (function () {
    var fn = {};
    fn.refresh = function(message) {
        alert(message);
    }
    return fn;
})();

var menu = (function () {
    var fn = {};
    fn.init = function(message) {
        events.refresh('Work from the function root'); // Work
        document.addEventListener("DOMContentLoaded", function() {
            events.refresh('Work from the domcontentloaded'); // Don't work
        });
    }
    return fn;
})();

menu.init();

问题

当运行menu.init 时，它会启动菜单初始化函数。它触发events.refresh 函数并通过消息发出警报。这部分工作得很好。

events.refresh 也在DOMContentLoaded 范围内被调用。当页面完全加载时触发。现在events.refresh 是undefined function。为什么？我怎样才能绕过它？

【问题讨论】：

标签： javascript function scope domcontentloaded

【解决方案1】：

我不确定，但认为link 可以帮助您理解。它帮助了我。 http://ablogaboutcode.com/2011/06/14/how-javascript-loading-works-domcontentloaded-and-onload/

【讨论】：

【解决方案2】：

在浏览器上运行代码可以正常工作（不是在 jsfiddle 中）。

检查：

1) 确保events 是否在全局上下文中声明

2) 尝试以“windows.events”访问事件（在大多数浏览器中，“window.event”是保留的，所以也许你应该尝试使用其他 var 名称）

document.addEventListener("DOMContentLoaded", function() {
  window.events.refresh('Work from the domcontentloaded');
});

澄清一下，DOMContentLoaded 在 DOM 完全构建后立即触发。如果要在页面完全加载后处理，则需要使用“onload”。

【讨论】：