当光标悬停在HTML5画布上的图像上时,更新段落中显示的文本

我在HTML5画布上有一些图像,我想调用一个函数来更新HTML中显示的文本 <p></p> 标记。 使用以下功能将图像绘制到画布上:

function drawBox(imageObj, img_x, img_y, img_width, img_height) {
    console.log("function drawBox is drawing the description boxes");
    var canvasImage = new Kinetic.Image({
      image: imageObj,
      width: img_width,
      height: img_height,
      // puts the image in the middle of the canvas
      x: img_x,
      y: img_y
    });

    // add cursor styling

    imagesLayer.add(canvasImage);
}

我已尝试在上添加 mouseover 函数,通过添加一些代码来调用我拥有的将段落内容更新到此函数的函数 drawBox 函数现在看起来是这样的:

function drawBox(imageObj, img_x, img_y, img_width, img_height) {
    console.log("function drawBox is drawing the description boxes");
    var canvasImage = new Kinetic.Image({
      image: imageObj,
      width: img_width,
      height: img_height,
      // puts the image in the middle of the canvas
      x: img_x,
      y: img_y
    });

    // add cursor styling


    canvasImage.on("mouseover", function(){
        //displayAssetDescriptionTip();
        console.log("displayAssetDescriptionTip() is being called on mouseover event");

        });

    imagesLayer.add(canvasImage);
}

当我如上所述查看带有此功能的页面,并将光标悬停在已添加该功能的图像上时,即我已添加到 鼠标悬停 函数正在控制台中显示,所以我知道mouseover工作正常。

然而,我遇到的问题是,我想从 鼠标悬停 事件你会在上面看到,我已经注释掉了对函数的调用 displayAssetDescriptionTip() 在我的 鼠标悬停 事件这是我想在光标悬停在这些图像上时调用的函数,然而,它似乎总是将段落中的文本更改为属于第一个描述框的文本。。。即,如果光标悬停在我添加的任何图像上 鼠标悬停 事件,则文本将更改为属于第一个图像的文本,而不是光标悬停在其上的图像。

功能是:

function displayAssetDescriptionTip(){
    if(canvasImage.id = "assetBox")
        document.getElementById('tipsParagraph').innerHTML = tips[34];
    else if(canvasImage.id = "liabilitiesBox")
        document.getElementById('tipsParagraph').innerHTML = tips[35];
    else if(canvasImage.id = "incomeBox")
        document.getElementById('tipsParagraph').innerHTML = tips[36];
    else if(canvasImage.id = "expenditureBox")
        document.getElementById('tipsParagraph').innerHTML = tips[37];
    else return;

    console.log("displayAssetDescriptionTip being called");
}

有人知道为什么它总是将文本更改为第一个图像的文本,而不是与任何其他图像对应的文本吗?我已经设置它,根据光标悬停在哪个图像上,将文本更改为数组的不同元素,因此它应该为每个图像显示与该数组不同的元素。。。