从不同JS文件中的另一个函数调用JavaScript函数

我有一个显示HTML5画布的网页。加载网页时，将调用以下JavaScript函数：

window.onload = function(){
    var sources = {};
        sources[0] = document.getElementById("building").src,
        sources[1] = document.getElementById("chair").src,
        sources[2] = document.getElementById("drink").src,
        sources[3] = document.getElementById("food").src,
        sources[4] = document.getElementById("fridge").src,
        sources[5] = document.getElementById("land").src,
        sources[6] = document.getElementById("money").src,
        sources[7] = document.getElementById("oven").src,
        sources[8] = document.getElementById("table").src,
        sources[9] = document.getElementById("van").src,

        sources[10] = document.getElementById("burger").src,
        sources[11] = document.getElementById("chips").src,
        sources[12] = document.getElementById("drink").src,
        sources[13] = document.getElementById("franchiseFee").src,
        sources[14] = document.getElementById("wages").src,

        sources[15] = document.getElementById("admin").src,
        sources[16] = document.getElementById("cleaners").src,
        sources[17] = document.getElementById("electricity").src,
        sources[18] = document.getElementById("insurance").src,
        sources[19] = document.getElementById("manager").src,
        sources[20] = document.getElementById("rates").src,
        sources[21] = document.getElementById("training").src,
        sources[22] = document.getElementById("water").src,

        sources[23] = document.getElementById("burger").src,
        sources[24] = document.getElementById("chips").src,
        sources[25] = document.getElementById("drink").src,

        sources[26] = document.getElementById("creditors").src,
        sources[27] = document.getElementById("electricity").src,
        sources[28] = document.getElementById("food").src,
        sources[29] = document.getElementById("hirePurchase").src,
        sources[30] = document.getElementById("loan").src,
        sources[31] = document.getElementById("overdraft").src,
        sources[32] = document.getElementById("payeTax").src,
        sources[33] = document.getElementById("tax").src

    loadImages(sources, drawImage);
    drawGameElements();
    drawDescriptionBoxes();
};

此函数将HTML隐藏部分中的一些图像加载到JavaScript中，并通过对“sources”数组中的每个图像调用“drawImage（）”函数将它们绘制到画布。然后调用'drawGameelements（）；'函数，它将更多的东西绘制到画布上，最后，我想调用'DrawDescriptionBox（）'函数

但是，该函数与代码的其余部分在一个单独的JS文件中，当我在浏览器中查看页面时，尽管调用了“loadImages（）”和“drawGameElements（）”，并将它们应该绘制到画布上，但控制台中会出现一个错误，错误是：

ReferenceError:未定义DrawDescriptionBox

我认为这意味着我没有正确引用该函数，因为它与调用它的文件不在同一个文件中

---

我想知道的是如何从另一个文件调用这个函数？如果将

DrawDescriptionBox

定义为全局函数，例如

function drawDescriptionBoxes() {
}

---

然后，找不到它意味着包含它的javascript文件没有加载。显示如何在html中包含此文件以及如何定义函数。

为什么未定义

DrawDescriptionBox

函数有两种可能

1）超出范围

在JavaScript中，变量存在于某种范围内。这可能是全球性的，例如：

<script>
var foo = 123; //foo can be referenced anywhere, it's global!
</script>

您的

DrawDescriptionBox

函数可能不在全局范围内

2）代码运行时尚未定义它

您也可能有如下代码：

文件1

var结果=someFunc（123）；

文件2

函数someFunc（x）
{
返回x*2；
}

如果文件2包含在文件1之后，则运行文件1时，

someFunc

还不存在。您可以通过在文档完全加载后使用事件处理程序运行所有内容来解决此问题。如果

var result=someFunc（123）

在onload事件中运行，无论在哪个文件中定义了

someFunc

，它都可以正常工作

---

希望这有帮助

文件名无关紧要，关键在于函数的作用域。能否显示DrawDescriptionBox的代码，以及如何包含这两个javascript文件？请使用循环（在带有ID的数组上，或在所有图像上），而不是34行重复代码。您的代码都湿透了。尝试一下。还要注意，你的“数组”实际上是一个对象。啊，太好了，干杯。我漏掉了包含文件的那一行——我以为我在那里，但那一定是旧版本。谢谢

function myFunc()
{
   var bar = function () //bar can only be accessed within myFunc
   {

   };
};

//bar() here is undefined

<script>
   var result = someFunc(123);
</script>

<script>
   function someFunc(x)
   {
      return x * 2;
   }
</script>