首页 > 解决方案 > 当我尝试上传图片时,它无法正常工作

问题描述

顺便说一下,我使用的是 Visual Studio Code 而不是 codepen。在一堂课中,我被介绍了全局变量。我在名为“image”的“//全局变量”注释下创建了一个。我可以在任何地方访问它。但是,我的代码仍然无法正常工作。

有人知道为什么吗?下面是 HTML 文件的 JavaScript 部分。我检查了我所有的 CSS 和 HTML 代码,我确信错误在于 JavaScript 代码。

<script src="https://www.dukelearntoprogram.com/course1/common/js/image/SimpleImage.js">
</script>
<script>
    //Global Variable
    var image;
    //Function for uploading a file
    function upload() {
        image = new SimpleImage(fileinput);
        var imgcanvas = document.getElementById("canvas1");
        var fileinput = document.getElementById("finput");
        image.drawTo(imgcanvas);
    }
    function makeGray() {
        for (var pixel of image.values()) {
            var avg = (pixel.getRed() + pixel.getGreen() + pixel.getBlue())/3;
            pixel.setRed(avg);
            pixel.setGreen(avg);
            pixel.setBlue(avg);
        }
        var imgcanvas = document.getElementById("canvas1");
        image.drawTo(imgcanvas);
    }
</script>

标签: javascripthtml

解决方案


据我所知,您在声明之前使用了 fileinput 变量。将您的功能更改为:

//Function for uploading a file
function upload() {
    var imgcanvas = document.getElementById("canvas1");
    var fileinput = document.getElementById("finput");
    image = new SimpleImage(fileinput);
    image.drawTo(imgcanvas);
}

我不知道这是否能解决你的问题,因为我们没有所有的部分,但这绝对是一个错误。


推荐阅读