jQuery的Ajax請求，並加載

圖片我有以下的Ajax調用：jQuery的Ajax請求，並加載

$("#container").html("loading..."); 

$.ajax({ 
    url: "somedoc.php", 
    type: "POST", 
    dataType: "html", 
    success: function(response){ 
     if(response != ''){ 
     $("#container").html(response); 
     }     
    } 
});

迴應是這樣的：所有圖像下載到用戶之前

<ul> 
    <li><img src="big_size_image_1.jpg" alt="" /></li> 
    <li><img src="big_size_image_2.jpg" alt="" /></li> 
    <li><img src="big_size_image_3.jpg" alt="" /></li> 
</ul>

Ajax調用完成了。所以是否有可能在這裏使用加載功能並顯示加載文本，而不是所有的圖像都加載了？

您的幫助將被處理。

來源

2012-02-14 Bounce

你可以加載事件附加到圖像，看看這對你的作品：

$.ajax({ 
    url: "somedoc.php", 
    type: "POST", 
    dataType: "html", 
    success: function(response){ 
     if(response != ''){ 
     var $imgs = $("#container").html(response) 
         .find("img") //find the appended images 
         .hide(), //hide them 
      imgAmount = $imgs.length, 
      imgCounter = 0; 

     //Here you should show your loading text 

     $imgs.on("load", function(){ 
      imgCounter++; 
      if(imgCounter === imgAmount) { 

      //Here you should hide your loading text 

      $imgs.fadeIn(); //show the images when they're loaded 
      } 
     }); 
     }     
    } 
});

來源

2012-02-14 14:11:22 NicoSantangelo

的方法@Royi納米爾拿了遞減量零如果你不想測試長度，這是個好主意 – NicoSantangelo 2012-02-14 14:13:07

yeah 如果你知道你應該得到多少圖像（你可以指望李的）。

#myWrapperelement =您注入響應的元素。

就成功

：功能：

$("#MyloadingLabel").show() 

     var num=$("ul li").length; 

       $("#myWrapperelement").on('load',"img ",function(){ 
       num--; 
       if (num==0) $("#MyloadingLabel").hide(); 
      });

來源

2012-02-14 14:03:14

jQuery的Ajax請求，並加載

回答

相關問題