如何在独立文件js中调用函数？

Question

我在两个文件js，file1和file2中定义了一些函数。在每个文件中，所有功能都在$(document).ready(function(){});之内。我仔细地将file1放在一个php文件中，然后在file2中调用file1中的一个函数，但是控制台返回未定义的函数。这里有什么问题？

Answer 1

如果函数是在文档就绪处理程序中定义的，那么它们只存在于该范围内，并且在其他地方无法访问。

最简单的解决办法是定义您的文档准备处理以外的功能和使用他们准备好处理程序内或在彼此内：

文件1：

function myFunc() { 
    myOtherOtherFunc(); 
} 

$(document).ready(function() { 
    myOtherFunc(); 
}); 

文件2：

function myOtherFunc() { 
} 

function myOtherOtherfunc() { 
} 

$(document).ready(function() { 
    myFunc(); 
}); 

应该指出的是，这将函数放在全局范围内，并且这应该保持在最小限度，所以如果您发现有很多需要在文件之间共享，您应该考虑使用命名空间或甚至是像模块加载器一样更复杂（例如， require.js）。

Answer 2

$（document）.ready应该在html页面上调用。我建议你将各个js文件中的函数分开，并从page.ready中调用这些函数。我认为这应该可以解决问题。

Answer 3

因为你在另一个函数中定义你的函数，所以它们不是全局变量。这是一个好的的事情。

有几个方法可以解决这个：

1. 让他们的全局（BLECH），或

2. 使用AMD机制像RequireJS，或

3. 使用单全球，提及您的所有功能

这最后看起来像这样：

var MyApp = MyApp || {}; 
$(document).ready(function() { 
    MyApp.myFunction = function() { 
     // ... 
    }; 
}); 

然后你就可以通过MyApp.myFunction()从任何地方调用它们。