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请求，并加载

回答

相关问题