簡體   English   中英

功能太快?

[英]function is too fast?

這個功能確實有效,但我認為這不是一個好的解決方案。 如果我不添加 setTimeout,該功能將無法正常工作。 (它可能只加載一半的圖片)。 是否存在我在 for 循環中不使用“i”的問題?

<img>標簽加載到隱藏的“加載”div 中以使用它們並將它們分類為 3 個不同的 div 是一個“好”的解決方案嗎?

function loadpictures() {
  $('#load').empty();
  $('#picTop').empty();
  $('#picMiddle').empty();
  $('#picBottom').empty();

  $('#load').load('pages/bilder.html .' + category, function() {

    LineW[0] = LineW[1] = LineW[2] = 0;

    for (var i = 0; i < $('#load img').length; i++) {
      window.setTimeout(function() {
        var shortLine = 0;
        for (var j = 1; j < 3; j++) {
          if (LineW[j] < LineW[shortLine]) {
            shortLine = j;
          }
        }
        switch (shortLine) {
          case 0:
            $('#picTop').prepend($('#load img')[0]);
            LineW[0] += $('#picTop img')[0].offsetWidth;
            break;
          case 1:
            $('#picMiddle').prepend($('#load img')[0]);
            LineW[1] += $('#picMiddle img')[0].offsetWidth;
            break;
          case 2:
            $('#picBottom').prepend($('#load img')[0]);
            LineW[2] += $('#picBottom img')[0].offsetWidth;
        break;
    }
  }, 20);
}

}); }

此示例等待圖像加載。 如果你想重構它,我建議獲取一組圖像路徑,然后使用他/她的函數。

function loadImage(path, width, height, target) {
  $('<img src="'+ path +'">').load(function() {
    $(this).width(width).height(height).appendTo(target);
  });
}

我用 .each jquery 函數替換了 for 循環,現在它對我來說很完美:) 無論如何!

$('#load').load('pages/bilder.html .'+category, function(){

$('#load img').each(function () {
    var shortLine = 0;
    for(var j = 1; j < 3; j++){
        if(LineW[j] < LineW[shortLine]){
            shortLine = j;
        }
    }
    switch (shortLine) {
        case 0:
            $('#picTop').prepend($('#load img')[0]);
            LineW[0] += $('#picTop img')[0].offsetWidth +5;
            break;
        case 1:
            $('#picMiddle').prepend($('#load img')[0]);
            LineW[1] += $('#picMiddle img')[0].offsetWidth +5;
            break;
        case 2:
            $('#picBottom').prepend($('#load img')[0]);
            LineW[2] += $('#picBottom img')[0].offsetWidth +5;
            break;
    }
});
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM