尝试了Stackoverflow的许多解决方案后,我想看看是否有人可以提供帮助。我正在使用此模板-https://startbootstrap.com/template-overviews/agency/。此时,页面加载时图像正在加载。我希望在模态打开时加载图像。
工作原理:
$('img[src="img/port/wait-images.jpg"]').each(function(index, el) {
$(el).attr('src', $(el).data('real-src'));
});
var globalLazyLoad = new LazyLoad();
<img class="img-fluid" src="img/port/wait-images.jpg" data-real-src="img/port/the-real-image.jpg" alt="">
此代码仅在页面加载时显示等待图像。
问题:
我希望在打开模态时加载某些图像。
答案 0 :(得分:0)
您应该使lazyload方法在打开的模式调用中触发。
function loadImagesToModal(){
$('img[src="img/port/wait-images.jpg"]').each(function(index, el) {
$(el).attr('src', $(el).data('real-src'));
});
}
$({the modal's class}).on('shown.bs.modal', function (e) {
loadImagesToModal();
})
这样,您可以让它们仅在该事件上交换