folletos de juicio js, varias imágenes cargadas

1, una sola imagen (imágenes generadas dinámicamente)

// JS 
 var Xiu = nueva nueva imagen () 
 xiu.src = 'http://static.igeekee.cn/scenelogo/default.png' 
 xiu.onload = función () {
     // cargado 
 }

2, una sola imagen (combinado ES6 Promise)

nueva promesa ((resolución, rechazar) => { 
        dejar Xiu = nueva imagen () 
        xiu.src = 'http://static.igeekee.cn/scenelogo/7tianliansuo.jpg' 
        xiu.onload = función () {
            // 加载完成
           determinación (Xiu) 
        } 
     }). entonces ((Xiu) => {
        // código 
        console.log (Xiu) 
     })

3, múltiples imágenes (JS)

var img = [],   
    bandera = 0 , 
    mulitImg = [
     'http://www.daqianduan.com/wp-content/uploads/2017/03/IMG_0119.jpg' ,
     'http://www.daqianduan.com/ wp-content / uploads / 2017/01 / 1.jpg ' 'http://www.daqianduan.com/wp-content/uploads/2015/11/jquery.jpg' ,
     ' http: //www.daqianduan. com / wp-content / uploads / 2015/10 / maid.jpg' 
 ]; var imgTotal = mulitImg.length;
 para ( var i = 0; i <imgTotal; i ++ ) { 
    img [i] = nueva imagen () 
    img [i] .src =
 mulitImg [i] 
    IMG [i] .onload = función () {
        // i-cargados fotos 
       en bandera ++ IF (En la bandera == imgTotal) {
           // todos cargados        } 
    } 
 }
       

4, varias imágenes (combinado ES6 Promise.all ())

dejar que mulitImg = [
         'http://static.igeekee.cn/scenelogo/zhongguoyinhang.png' ,
         'http://static1.igeekee.cn/2_1487751969296_2872.jpg' ,
         http://static1.igeekee.cn/25_1488621623561_6152' .jpg' ,
         'http://static.igeekee.cn/scenelogo/pizzahut.png' 
    ]; 
    dejar que promiseAll = [], img = [], imgTotal = mulitImg.length;
    para (dejar que i = 0; i <imgTotal; i ++ ) { 
        promiseAll [i] = nueva promesa ((resolución, rechazar) => { 
            img [i] = nueva imagen () 
            img [i] .src =mulitImg [i] 
            img [i] .onload = función () { 
                determinación (img [i]) 
            } 
        }) 
    } 
    Promise.all (promiseAll) .then ((IMG) => { 
        console.log ( '加载完成' ) 
    })

 

Supongo que te gusta

Origin www.cnblogs.com/chailuG/p/12511104.html
Recomendado
Clasificación