一个大型轮播,每一个分页中都嵌套一个ifream页面,导致进入页面加载需要15s 响应问题很明显,试过用懒加载,但是效果好像并不是很好。
这是demo代码
<div class="slider iframe-wrapper">
<div>
<iframe id="iframe1" name="iframe1" src="http://123.56.29.74:9008/succezbi/meta/TOPAVENUE/analyses/TOPGSBGA/RPT_ZH_DPZS/report1?user=user&password=top@123&$sys_calcnow=true&$sys_showCaptionPanel=false"
frameborder="0"></iframe>
</div>
<div>
<iframe id="iframe2" name="iframe2" src="http://123.56.29.74:9008/succezbi/meta/TOPAVENUE/analyses/TOPGSBGA/RPT_ZH_DPZS/rpt_gdsscztcl?user=user&password=top@123&$sys_calcnow=true&$sys_showCaptionPanel=false"
frameborder="0"></iframe>
</div>
<div>
<iframe id="iframe3" name="iframe3" src="http://123.56.29.74:9008/succezbi/meta/TOPAVENUE/analyses/TOPGSBGA/RPT_ZH_DPZS/rpt_scztclfx?user=user&password=top@123&$sys_calcnow=true&$sys_showCaptionPanel=false"
frameborder="0"></iframe>
</div>
<div>
<iframe id="iframe4" name="iframe4" src="http://123.56.29.74:9008/succezbi/meta/TOPAVENUE/analyses/TOPGSBGA/RPT_ZH_DPZS/qrqyhs?user=user&password=top@123&$sys_calcnow=true&$sys_showCaptionPanel=false"
frameborder="0"></iframe>
</div>
<div>
<iframe id="iframe5" name="iframe5" src="http://123.56.29.74:9008/succezbi/meta/TOPAVENUE/analyses/TOPGSBGA/RPT_ZH_DPZS/kszzhy1?user=user&password=top@123&$sys_calcnow=true&$sys_showCaptionPanel=false"
frameborder="0"></iframe>
</div>
</div>
var count = $(".slider div iframe").size(); //iframe的个数
console.log('count', count)
setTimeout(updateIframeSrc(count), 500);
function updateIframeSrc(index) {
// debugger
console.log(index)
var iframe = $(".slider div iframe").eq(index);
iframe.attr("src", iframe.attr("id"));
iframe.load(function () {
console.log('index',index);
setTimeout(function () {
updateIframeSrc(++index);
}, 500);
if(index==count){
return;
}
});
}