javascript - 需要时导入javascript文件和全局变量

Question

我正在使用导入功能，仅在需要时导入 javascript 文件。我的功能如下所示。它们位于 main.js 文件和 jquery 就绪包装器中。

$(function() {
    function globaltrigger(){
        alert('');
    }

    function $import(src){
        var scriptElem = document.createElement('script');
        scriptElem.setAttribute('src',src);
        scriptElem.setAttribute('type','text/javascript');
        document.getElementsByTagName('head')[0].appendChild(scriptElem);
    }
});

假设我们通过单击鼠标导入一个 javascript 文件。 $import('newfile.js');。但是，这个新导入的文件无法访问 main.js javascript 文件中的函数。例如:

// the following function is placed in the newfile.js file
$(function() {
    globaltrigger();
});

有什么方法可以做到这一点？

Answer 1

正如我所怀疑的，您的问题是 globaltrigger() 函数不在全局范围内。它位于 jQuery DOM 就绪函数中，因此无法从外部访问。

将其移动到全局范围内:

function globaltrigger(){
    alert('');
}

$(function(){
    // dom ready stuff
});

最好避免使用大量变量和函数污染全局空间。您可以将函数/变量存储在一个对象下，这是实现命名空间的一种简单方法。

var SomeApp = {};

SomeApp.globaltrigger = function(){
    alert('');
};

在外部 JavaScript 中你可以调用它:

SomeApp.globaltrigger();

这很好，因为您的所有代码都位于 SomeApp 对象下。