Question

的jsfiddle

的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。为什么？我怎么能绕过它？

Answer 1

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

Answer 2

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

检查：

1）确保在全局上下文中声明events

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

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

并且澄清一下，DOMContentLoaded在DOM构建完全后立即触发。如果你想在页面完全加载后处理，你需要使用'onload'。

从DOMcontentLoaded范围内加载函数

2 个答案: