javascript - 不调用 jQuery 动态加载图像

Question

早上好，我有一个图像，如果我将其静态地放置在 HTML 中并运行(使用 jQuery，但 JavaScript 也可以)“.click”事件，它就可以正常工作。我的 img 放置在 id 为“imgId”的 div 中。

    <div id="imgId">
        <img src="Pictures/sign_here.jpg" class="overlays" id="imgSignHere" 
             style="left: 864px; top: 252px;" />
    </div>

但是，如果我使用 JavaScript 动态创建此图像:

    var sigImage = document.createElement("img");
    sigImage.setAttribute('src', 'Pictures/image.jpg');
    sigImage.setAttribute('class', 'overlays');
    sigImage.style.left = "864px";
    sigImage.style.top = "252px";
    document.getElementById('imgId').appendChild(signHereImage);

我无法调用 .click 或任何 jQuery 或 JavaScript 鼠标单击事件。我很可能忽略了一些非常简单的事情，但如果您能帮助我，我将不胜感激。非常感谢。

Answer 1

当我测试它时，它有效。另外，document.getElementById('imgId').appendChild(sigImage); 不正确。

var sigImage = document.createElement("img");
sigImage.setAttribute('src', 'https://pbs.twimg.com/profile_images/839721704163155970/LI_TRk1z.jpg');
sigImage.setAttribute('class', 'overlays');
sigImage.style.left = "864px";
sigImage.style.top = "252px";
document.getElementById('imgId').appendChild(sigImage);

sigImage.addEventListener("click", function() {

	alert("Hello");

});

<div id="imgId"></div>