2016-11-16 5 views
1

私は単純な画像レイジーローディング機構を作っています。私は処理する画像の配列から始め、それぞれをロードすると、配列からその画像を取り除きたいと思います。次のように配列の要素が早すぎて削除されていますか?

私のコードは次のとおりです。

const removeFromArray = (id) => { 
    const position = images.indexOf(id); 

    if (id.classList.contains(classes.loaded)) { 
     images.splice(id, 1); 
    } 
    } 

    const setHeight = (img, target) => { 
    const parentWidth = img.parentNode.offsetWidth; 
    const initw = target.width; 
    const inith = target.height; 

    return (parentWidth/initw) * inith; 
    } 

    const loadImage = (img) => { 
    const image = new Image(); 

    img.classList.add(classes.loading); 
    image.src = img.getAttribute('data-lazy-img'); 
    image.onload = function(e) { 
     const target = e.target || e.srcElement; 

     img.style.height = `${setHeight(img, target)}px`; 
     img.classList.add(classes.loaded); 
     img.classList.remove(classes.loading); 
     img.src = img.getAttribute('data-lazy-img'); 

     removeFromArray(img); 
    } 
    } 

問題は、時々間違ったイメージが削除されるである(私は後者を削除する場合は特に)。

私の全体のコードはここにある:http://codepen.io/tomekbuszewski/pen/LbRQxq?editors=0011

私は何ができますか?

+1

'images.splice(IDはなく、 1); '' images.splice(position、1)にする; '? –

答えて

1

パラメータとして画像IDとspliceを呼び出すために意味をなさないようだ:

images.splice(id, 1); 

あなたはおそらくこれを行うためのもの:

images.splice(position, 1); 
+0

あなたは完全に正しいです!ありがとうございました! –

+1

この質問は、タイプミスとして閉じられるべきです。 –

関連する問題