为什么我不能将图像绘制到画布中

我有一个画布和一个带有缩小图像的div。我想将其中一个缩小的图像拖到画布中。单击图像时，应保存 src，以便在将该图像放入画布时，我会以原始比例绘制。由于某种原因，此代码不起作用...

.HTML

<div id="LeftColumn">
    <canvas id="Canvas">
    </canvas>
</div>
<div id="TextureViewInside">
    <ul class="products">
        <img onclick="getSource(this.src)" id="firstPic" src="FärgadePapper.png">
            <img src="Hajar.png">
            <img src="Labyrint.png">
            <img src="Martini.png">
            <img src="FärgadePapper.png">
    </ul>
</div>

JavaScript

function first(){
    canvas = document.getElementById('Canvas');
    var ctx = canvas.getContext("2d");
    canvas.addEventListener("dragenter", function(e){e.preventDefault();}, false);
    canvas.addEventListener("dragover", function(e){e.preventDefault();}, false);
    canvas.addEventListener("drop", dropped, false);
}
function getSource(scr){
    alert(src);
    a = new image();
    a.src = src;
}
function dropped(){
    canvas.drawImage(a, 0, 0);
}
window.addEventListener("load", first, false);