javascript - div中的JavaScript图像

Question

我有这个代码：

function getImage(imgPath,override){
    image=new Image();
    image.src=imgPath;
    document.getElementById('imgboxDavanti').appendChild(image);
}

调用这个函数的 HTML 是：

<a href='#' onclick="getImage('immagini/giaccasaccobacino/1petto/beige.png','true')">

这是我放置图像的 div

<div id="imgbox">
    <div id="imgboxDavanti">IMAGE HERE</div>
    <div id="imgboxDietro"></div>
</div>

但我不显示图像（如果我将错误的路径作为参数传递，我会看到典型的“找不到图像”图标）。有什么问题？

Answer 1

尝试使用创建元素<input type="image" src="picture.gif" />

function getImage(imgPath,override){
image=document.createElement('INPUT');
image.type="image";
image.src=imgPath;
document.getElementById('imgboxDavanti').appendChild(image);
}

演示

Answer 2

如果你修改这个？（您的代码中没有明显的错误，但主要检查错误消息的内容（如果有的话）。）；

function getImage(imgPath,override){
    image = document.createElement('img');
    image.onload = function() {
        document.getElementById('imgboxDavanti').appendChild(image);
    }
    image.onerror = function(e) {
        console.log(e);
        alert('Error occurred, see console for details.');
    }
    image.src = imgPath;
}