javascript - 如何确认使用 jquery 在 DOM 上插入的图像是否已完整加载

Question

我在这方面寻求帮助：

我有一段代码放入我使用 jquery 放入 div 的变量中，在我将 conde 放在该 div 上后，我将页面重定向到另一个 URL，现在这是我的问题：该代码内容为图像，我需要重定向当我确定图像已完全加载到该 div 时的页面，因为这是一个跨域，我不能使用 .load (jquery)，任何建议我如何才能确认图像已完全加载所以我可以确认后重定向？

<div id="trackBeaconContainer"></div>

var trackBeacon = "<div id='beacon_08d6ab8d99' style='position: absolute; left: 0px; top: 0px; visibility: hidden;'><img src='http://domain.com/openx/www/delivery/lg.php?bannerid=4&amp;campaignid=3&amp;zoneid=2&amp;loc=1&amp;cb=08d6ab8d99' width='0' height='0' alt='' style='width: 0px; height: 0px;' /></div>"

$j("#trackBeaconContainer").html(trackBeacon);

window.location = "http://otherurl.com"

Answer 1

使用图片加载事件

$j("#trackBeaconContainer")
    .html(trackBeacon)
    .find("img")
        .load( function() {
            window.location.href = "http://example.com";
         });

Answer 2

您可以使用 img 标签 onload 事件

<img src='http://domain.com/openx/www/delivery/lg.php?bannerid=4&amp;campaignid=3&amp;zoneid=2&amp;loc=1&amp;cb=08d6ab8d99' width='0' height='0' alt='' style='width: 0px; height: 0px;' onload='window.location="http://otherurl.com"' />