javascript - Canvas を動的に作成し、onmousedown 機能を追加する

Question

実行時に複数のキャンバス要素を動的に作成する必要があります。キャンバスをうまく作成できましたが、「onmousedown」属性をメソッドに設定するのは難しいことがわかりました。よくわかりませんが、これはキャンバス要素を関数に渡す必要があるためかもしれません。誰でも助けることができますか？

ありがとうございました！

以下に、元の静的キャンバス、動的にキャンバスを作成するためのループ、および「onmousedown」として設定する必要がある関数を順に示します。

<canvas id="Canvas1" onmousedown="MouseDown(this, event)" onmousemove="MouseMove(event)" onmouseup="MouseUp(event)" width="0" height="600" style="overflow: hidden; position: absolute; top: 0px;">

for(var i = 1; i < total; i++)
{
    var div = document.getElementById("Control");
    var canv = document.createElement('canvas');
    canv.id = "Canvas" + i.toString();         
    canv.width= 0+'px';
    canv.height= 600+'px';
    canv.style.overflow = 'hidden';
    canv.style.position = 'absolute'; 
    canv.style.top = 0+'px';

    div.appendChild(canv);
}

function MouseDown(can, e)
{

    MovingCanvas = can;
    alert("got here");
    clicked = true;
    MouseX = e.clientX;
    MouseY = e.clientY;

    StartX = MovingCanvas.style.left;
    StartY = MovingCanvas.style.top;
}