Javascript 用户上传图像

我有一个带有文本输入的kineticjs框和一个“onLoad”图像（Yoda）。我需要实现这个“imageLoader”（）

我有一个画布，我把它放在一起，但不能进入我的新的动力学

如果有人能帮我把“上传图片”放到我的网站上，我将不胜感激。

---

提前感谢：）

只需修改“imageLoader”小提琴上的代码，创建一个新的Kinetic.Image并将其添加到图层，而不是直接绘制到画布上下文

//image loader
var imageLoader = document.getElementById('imageLoader');
    imageLoader.addEventListener('change', handleImage, false);

function handleImage(e){
    var reader = new FileReader();
    reader.onload = function(event){
        var img = new Image();
        img.onload = function(){
            layer.add(new Kinetic.Image({
                x: 200,
                y: 50,
                image: img,
                width: img.width,
                height: img.height,
                draggable: true
            }));
            text.moveToTop();
            layer.draw();
        }
        img.src = event.target.result;
    }
    reader.readAsDataURL(e.target.files[0]);     
}

---

小提琴手：

哇，我绞尽脑汁想试试。。一定错过了什么。非常感谢你的帮助！：）知道如何在文本后面加载图像吗？

//image loader
var imageLoader = document.getElementById('imageLoader');
    imageLoader.addEventListener('change', handleImage, false);

function handleImage(e){
    var reader = new FileReader();
    reader.onload = function(event){
        var img = new Image();
        img.onload = function(){
            layer.add(new Kinetic.Image({
                x: 200,
                y: 50,
                image: img,
                width: img.width,
                height: img.height,
                draggable: true
            }));
            text.moveToTop();
            layer.draw();
        }
        img.src = event.target.result;
    }
    reader.readAsDataURL(e.target.files[0]);     
}