Javascript Firebug引用错误，其中一个函数在'；从KineticJS库调用

我正在使用KineticJS库在画布上绘制一些图像，并使它们可拖动。我已经下载了一个库的副本，这样我就可以对它进行一到两个轻微的调整，以便在我正在制作的画布游戏中使用它

我修改的KineticJS库中的函数是

drawHit: function(){}

最初，函数如下所示：

drawHit: function() {
    this.hitCanvas.clear();
    Kinetic.Container.prototype.drawHit.call(this);
},

但我已经添加了几个对我编写的函数的调用：

drawHit: function() {
    this.hitCanvas.clear();
    drawGameElements();
    drawDescriptionBoxes(imageObj);
    Kinetic.Container.prototype.drawHit.call(this);
},

我之所以这样做，是因为之前，在画布上拖放图像时，当检测到单击时，画布将被完全清除，只有图像会被重新绘制-我在画布上显示了一些其他的东西，每次移动图像时，画布被重新绘制时，我都想保留这些东西。（这些东西是由我添加到此函数的两个函数调用绘制的）

但是，当我现在在浏览器中查看我的页面时，我得到Firebug控制台错误：

ReferenceError: drawDescriptionBoxes is not defined

drawDescriptionBoxes(imageObj);

在线

drawDescriptionBoxes(imageObj);

drawdescriptionboxes();

（我已将其添加到函数中）

函数“drawDescriptionBoxes”在名为“drawDescriptionBoxes.js”的文件中定义，其代码如下：

function drawDescriptionBoxes(imageObj){
/*  CanvasRenderingContext2D.prototype.drawDescriptionArea = function(x, y, width, height, radius, stroke){
        if(typeof stroke == "undefined" ){
            stroke = true;
        }
        if(typeof radius === "undefined"){
            radius = 5;
        }
        this.beginPath();
        this.moveTo(x + radius, y);
        this.lineTo(x + width - radius, y);
        this.quadraticCurveTo(x + width, y, x + width, y + radius);
        this.lineTo(x + width, y + height - radius);
        this.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
        this.lineTo(x + radius, y + height);
        this.quadraticCurveTo(x, y + height, x, y + height - radius);
        this.lineTo(x, y + radius);
        this.quadraticCurveTo(x, y, x + radius, y);
        this.closePath();
        if(stroke){
            context.stroke();
        }
    } */
    var assetsDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 70,
        y: 400
        draggable: false
    });

    var liabilitiesDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 300,
        y: 400
        draggable: false
    });

    var incomeDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 540,
        y: 400
        draggable: false
    });

    var expenditureDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 750,
        y: 400
        draggable: false
    });

}

我正在从

window.onload = function(){} 

在我的index.html页面中

drawDescriptionBoxes(imageObj);

drawdescriptionboxes();

我还有另外两个函数也在这里以完全相同的方式被调用，它们没有问题

有人知道我为什么会有这个参考错误吗

编辑

我还得到一个语法错误：DrawDescriptionBox.js第30行的属性列表后面缺少}：

function drawDescriptionBoxes(imageObj){
/*  CanvasRenderingContext2D.prototype.drawDescriptionArea = function(x, y, width, height, radius, stroke){
        if(typeof stroke == "undefined" ){
            stroke = true;
        }
        if(typeof radius === "undefined"){
            radius = 5;
        }
        this.beginPath();
        this.moveTo(x + radius, y);
        this.lineTo(x + width - radius, y);
        this.quadraticCurveTo(x + width, y, x + width, y + radius);
        this.lineTo(x + width, y + height - radius);
        this.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
        this.lineTo(x + radius, y + height);
        this.quadraticCurveTo(x, y + height, x, y + height - radius);
        this.lineTo(x, y + radius);
        this.quadraticCurveTo(x, y, x + radius, y);
        this.closePath();
        if(stroke){
            context.stroke();
        }
    } */
    var assetsDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 70,
        y: 400
        draggable: false
    });

    var liabilitiesDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 300,
        y: 400
        draggable: false
    });

    var incomeDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 540,
        y: 400
        draggable: false
    });

    var expenditureDescriptionBoxImage = new Kinetic.Image({
        image: imageObj,
        width: 120,
        height: 70,
        x: 750,
        y: 400
        draggable: false
    });

    context.drawImage(sources[34], 70, 400, 120, 70);
    context.drawImage(sources[35], 300, 400, 120, 70);
    context.drawImage(sources[36], 540, 400, 120, 70);
    context.drawImage(sources[37], 750, 400, 120, 70);

}

第30行是：

draggable: false

在

---

所以我不知道这是否会导致另一个错误？

在Chrome中使用

开发工具
，或在firefox（F12）中使用
firebug
，在脚本中设置断点，一步一步地执行函数调用，并确保在调用之前包含并调用了库（函数已定义）

在第一次调用函数定义之前，您应该尝试复制/粘贴函数定义
DrawDescriptionBox
，一旦它工作正常，您应该将其放置在函数调用之前调用函数定义的位置。
我的
drawdescriptionboxes
函数定义位于一个单独的文件中，我调用它的位置-当然我也不需要将定义粘贴到调用它的位置，是吗？好的，那么如果它位于另一个文件中，您应该确保您是在调用函数之前包括您的文件，是的，您可以包括，正如我所提到的，只是为了测试和调试的目的，一旦确定问题出在哪里，您就可以修复它并取出代码。我在我的HTML页面中包括了我正在使用的所有JS文件，其中有如下行：
。它抱怨“dynamic.js库中没有定义DrawDescriptionBox…”。。。我已经在本地保存了库的副本，以便在库中添加对该函数的调用，并且正在使用我在本地保存的版本，而不是在线可用的版本。当然，我不需要将我的JS文件包含在我下载和修改过的KineticJS库中，以确保它了解它？如果它们都包含在我的HTML中，它们应该相互了解，对吗？正如我在脚本语言中告诉您的，为了调用函数，通常应该事先定义函数。在您的情况下，请确保在调用函数之前包含了库，并且定义了函数。第30行的错误是您忘记在前一行的400后面加逗号。它应该是
y:400，