在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/Java  HTML/ 異步圖片加載不能撐開DIV

異步圖片加載不能撐開DIV

問題描述

官網(wǎng)的文章內(nèi)容是從后臺(tái)請(qǐng)求的。然后通過JQ的html()插入到div里面;
插入之后獲取容器的高度和實(shí)際的高度不符合。
然后會(huì)導(dǎo)致溢出。我覺得是圖片加載的問題。
有沒有大佬提供個(gè)思路。
代碼在公司電腦, 明天貼上來

回答
編輯回答
舊顏

不能撐開DIV原因是:圖片還沒有完全加載完成,div不能獲取圖片的真正高度,導(dǎo)致?lián)尾婚_。
解決方案:監(jiān)聽圖片的加載過程,等圖片加載完成后,使用JQ的html()方法插入。

你可以自己寫代碼判斷所有圖片加載完成后(序號(hào)考慮兼容問題,特別是IE),再插入到dom中。也可以使用現(xiàn)有的插件,比如
imagesLoaded(官網(wǎng):https://imagesloaded.desandro...

偽代碼(這里使用jquery的方式使用該插件,該插件也可以不使用juery):

//html是從后臺(tái)獲取到的數(shù)據(jù)
var html = "<div>aaa<img src="xxx"/>bbb<img src="xxx"/></div>";
$(html).imagesLoaded( function() {//圖片加載完成后再插入到dom中。
       //插入到dom中。
});
2017年6月15日 21:30
編輯回答
孤巷

樓上說的有些道理,我補(bǔ)充一點(diǎn),可以通過監(jiān)聽圖片的onload事件,在這個(gè)事件中,你可以拿到圖片的寬高,然后可以暫時(shí)先把容器設(shè)置為同樣的寬高。

2018年1月7日 16:55