JavaScript控制圖片加載完成后調(diào)用回調(diào)函數(shù)的方法
更新時(shí)間：2015年03月20日 10:40:21 作者：令狐不聰
這篇文章主要介紹了JavaScript控制圖片加載完成后調(diào)用回調(diào)函數(shù)的方法,實(shí)例分析了javascript回調(diào)函數(shù)的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了JavaScript控制圖片加載完成后調(diào)用回調(diào)函數(shù)的方法。分享給大家供大家參考。具體分析如下：
這段代碼可以控制指定區(qū)域內(nèi)的圖片加載完成后執(zhí)行指定的回調(diào)函數(shù)。
復(fù)制代碼 代碼如下:
function when_images_loaded($img_container, callback) {
/* do callback when images in $img_container (jQuery object) are loaded. Only works when ALL images in $img_container are newly inserted images and this function is called immediately after images are inserted into the target. */
var _imgs = $img_container.find('img'),
img_length = _imgs.length,
img_load_cntr = 0;
if (img_length) {//if the $img_container contains new images.
_imgs.on('load', function() {//then we avoid the callback until images are loaded
img_load_cntr++;
if (img_load_cntr == img_length) {
callback();
}
});
}
else { //otherwise just do the main callback action if there's no images in $img_container.
callback();
}
}
/* do callback when images in $img_container (jQuery object) are loaded. Only works when ALL images in $img_container are newly inserted images and this function is called immediately after images are inserted into the target. */
var _imgs = $img_container.find('img'),
img_length = _imgs.length,
img_load_cntr = 0;
if (img_length) {//if the $img_container contains new images.
_imgs.on('load', function() {//then we avoid the callback until images are loaded
img_load_cntr++;
if (img_load_cntr == img_length) {
callback();
}
});
}
else { //otherwise just do the main callback action if there's no images in $img_container.
callback();
}
}
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- JS判斷圖片是否加載完成方法匯總(最新版)
- 關(guān)于JS判斷圖片是否加載完成且獲取圖片寬度的方法
- js實(shí)現(xiàn)圖片在未加載完成前顯示加載中字樣
- js或者jquery判斷圖片是否加載完成實(shí)現(xiàn)代碼
- js判斷圖片加載完成后獲取圖片實(shí)際寬高的方法
- 使用JavaScript判斷圖片是否加載完成的三種實(shí)現(xiàn)方式
- JavaScript實(shí)現(xiàn)判斷圖片是否加載完成的3種方法整理
- JavaScript怎么判斷圖片是否加載完成以便獲取其尺寸
- javascript判斷圖片是否加載完成的方法推薦
- JS實(shí)現(xiàn)判斷圖片是否加載完成的方法分析
相關(guān)文章
下面小編就為大家?guī)?lái)一篇js判斷是否為空和typeof的用法(詳解)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10
js實(shí)現(xiàn)的頁(yè)面加載完畢之前l(fā)oading提示效果完整示例【附demo源碼下載】
這篇文章主要介紹了js實(shí)現(xiàn)的頁(yè)面加載完畢之前l(fā)oading提示效果,結(jié)合完整實(shí)例形式分析了js頁(yè)面加載時(shí)顯示loading效果的實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-08-08
js實(shí)現(xiàn)跨域的4種實(shí)用方法原理分析
這篇文章主要分析了js實(shí)現(xiàn)跨域的4種實(shí)用方法原理，主要是使用jsonp跨域，使用window.name來(lái)進(jìn)行跨域，對(duì)這方面感興趣的朋友可以參考一下2015-10-10
Javascript的各種節(jié)點(diǎn)操作實(shí)例演示代碼
實(shí)例演示對(duì)javascript的節(jié)點(diǎn)的各種操作。包括hasChildNodes()，removeChild()，appendChild()，replaceChild()，insertBefore()，cloneNode()等2012-06-06
BootStrap中Table隱藏后顯示問(wèn)題的實(shí)現(xiàn)代碼
這篇文章主要介紹了BootStrap中Table隱藏后顯示問(wèn)題的實(shí)現(xiàn)代碼,需要的朋友可以參考下2017-08-08
基于VSCode調(diào)試網(wǎng)頁(yè)JavaScript代碼過(guò)程詳解
這篇文章主要介紹了基于VSCode調(diào)試網(wǎng)頁(yè)JavaScript代碼過(guò)程詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-07-07
這篇文章主要介紹了javascript操作select元素的方法,可實(shí)現(xiàn)針對(duì)select元素選中元素時(shí)動(dòng)態(tài)改變html元素的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)打字游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-12-12
window.open打開(kāi)窗口被攔截的快速解決方法
下面小編就為大家?guī)?lái)一篇window.open打開(kāi)窗口被攔截的快速解決方法。覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08
JavaScript使用Blob文件流下載txt、pdf、圖片等文件，自定義下載文件名
JavaScript使用Blob文件流下載txt、pdf、圖片等格式文件,同時(shí)自定義下載文件名,2023-08-08