Question

我正在写一个网站，使用javascript，HTML IE9 。

我找到了通过以下方式动态加载图像的解决方案：

document.getElementById("id_image").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.getElementById("id_filepic").value

与<IMG>相关的id_image和与<input id="id_filepic" type="file">相关的id_filepic

行后：

document.getElementById("id_image").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.getElementById("id_filepic").value

在html页面上显示图像之后发生的确切事件（因此，图像具有宽度+高度），以及如何捕获该事件？

了解IE9的解决方案对我很重要。

Answer 1

它不一定要在那一行之后，因为它无论如何都是异步的，但它是：

document.getElementById("id_image").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.getElementById("id_filepic").value;
document.getElementById("id_image").addEventListener('load', (function(i) {
    return function() {
        console.log(i, 'loaded');
    }, false);
})(i));

来源：Javascript Image onload event binding

Answer 2

我想参与我的解决方案，我找到了。

好吧，上面的内容是不可编辑的，并且“onload”也不是正确的事件（在我调查后使用“过滤器”命令时没有被触发）。

我所做的是稍微延迟，使用超时命令（大约一秒钟），如下所示：

    setTimeout(function () {
        alert("w: " + $("#id_image").width());
        alert("h: " + $("#id_image").height());
    }, 1000);

（甚至100毫秒就足够了，但是我检查了非常大的图像.1秒是非常大的，不会因大图像上的代码而掉落。）

延迟之后，我可以毫无问题地检索图像的宽度和高度。

这就完成了这个问题。

在IE9上加载图像后的事件

2 个答案: