Question

我有一个生成HTML的图库插件。我需要以某种方式等待，直到附加的html已经完成加载它的资产再次附加它。我试过window.load但是没有用。修改目标区域的唯一工作是setTimeout回调，我觉得非常hacky。

我怎样才能完成我想做的事情？我试图在生成的标记上运行的当前代码是：

jQuery('ol').append('<li data-toggle="modal" id="thumb" class="yt-thumb" overflow-scroll="false" overflow-scroll="true" data-target="#youtubeModal"><img src="/images/dome-thumb.jpg" /></li> '); // add youtube to thumb slider
 jQuery('ol').appendTo( jQuery('#thumb-area') )

Answer 1

继续我会做什么，我认识到它并不完美，但你可以通过onload事件将图像插入到dom中，当调用它时，插入模态知道浏览器已经完全加载了图像。

$('body').append('<img style="display:none" id="temp">');
$tempImg = $('img#temp');
$tempImg.on('load', function() {
     // Append your modal here
     jQuery('ol').append('<li data-toggle="modal" id="thumb" class="yt-thumb" overflow-scroll="false" overflow-scroll="true" data-target="#youtubeModal"><img src="/images/dome-thumb.jpg" /></li> '); // add youtube to thumb slider
     jQuery('ol').appendTo( jQuery('#thumb-area'))
});
$tempImg.attr('src', '/images/dome-thumb.jpg');

因此，当您更新隐藏临时图像上的src时，浏览器将下载图像，然后在完成后插入模态。

如何等到附加的html加载资产

1 个答案: