从另一个包含的 JavaScript 调用包含的 JavaScript 代码的函数答案

【问题标题】：Call function of included JavaScript code from another included JavaScript从另一个包含的 JavaScript 调用包含的 JavaScript 代码的函数
【发布时间】：2010-02-13 16:25:37
【问题描述】：

我正在尝试在我的页面中使用不同的加载 JavaScript，但我无法让他们说话。

<html>
<script type="text/javascript" src="jquery144.js"></script>
<script type="text/javascript" src="shared_functions.js"></script>
<script type="text/javascript" src="page_function_callers.js"></script>
</html>


// shared_functions.js
$(document).ready (function () {
    function sayHello (what) {
        alert (what);
    }
});

// page_function_callers.js
$(document).ready (function () {
    $("div.my_button").click (function () {
        sayHello ("Hello world!");
    });
});

我使用 jQuery，我想使用这种方式，因为它可以让我回收许多公共方法。我哪里错了？

【问题讨论】：

标签： javascript jquery function-calls

【解决方案1】：

函数 sayHello 在 DOMReady 事件 ($(document).ready) 的 scpoe 中声明。它在该范围之外将不可用。但是没有需要在那个范围内声明一个函数。即使sayHello 使用了很多 DOM 对象（在您的示例中它没有），它在被调用之前不会被执行，所以您唯一需要确保的是这样的函数不是调用直到 DOMReady 之后。

因此，您可以简单地删除 shared_functions.js 中的第一行和最后一行，即分别为 $(document).ready(function() { 和 });，您的代码就可以工作了。

【讨论】：

【解决方案2】：

当你在“ready”函数中声明“sayHello”（有人记得 Charlotte Church 的歌曲吗？天哪，回忆……）时，它是该函数的本地函数。如果您愿意，可以通过以下方式使其全球化：

window['sayHello'] = function sayHello(what) {
  alert(what);
};

（最好给函数一个“本地”名称——在“function”关键字之后的名称——因为这样函数在 Firebug 中就不会显示为“匿名”。）

我鼓励你研究将你的全局函数变成一个 jQuery 插件，或者至少是一个 jQuery“全局”，方法是将它放在 jQuery 对象而不是“窗口”上。

【讨论】：

【解决方案3】：

尝试在调用 $(document).ready 之外定义函数 sayHello。

【讨论】：

【解决方案4】：

在上面的代码中，sayHello() 方法只定义在匿名函数的作用域内。

此代码可能更适合您：

// shared_functions.js
window.MyNamespace = window.MyNamespace || {};
MyNamespace.sayHello = function(what)
{
  alert(what);    
};

// page_function_callers.js
$(document).ready (function ()
{
    $("div.my_button").click (function ()
    {
      MyNamespace.sayHello('hello world');    
    });
});

确保您以正确的顺序加载 JS 文件。还有更优雅的解决方案，但这是一个相当简单直接的解决方案。

这种方法的一个优点是不会污染全局命名空间。

【讨论】：

您的代码可以工作，但有什么意义呢？为什么将声明推迟到 DOMReady，然后从该范围中提取它，而不是在 DOMReady 上下文之外声明它？你知道命名空间在这里是多余的吗？只需输入window.sayHello =... 也会同样有效...
修改了代码以反映您的 cmets。如果可能的话，我仍然建议将此代码放在命名空间下。