FadeIn mysql數據1由1與jquery和ajax

Question

嗨即時通訊我正試圖淡入淡出從MySQL數據庫中獲得的每個數據。

繼承人什麼我走到這一步：

jQuery的

$("#coleccionmenu span").click(function() { 
     $("#coleccionmenu span").removeClass('focuscoleccion') 
     $(this).addClass('focuscoleccion'); 
     var id = this.id; 

     $.ajax({ 
      url: "respuestabolsas.php", 
      type: "POST", 
      data: "id=" + id, 

      complete: function() { 
      //called when complete 
      }, 

      success: function(x) { 
      $("#contbolsas").css('display', 'none') 
      $("#contbolsas").html(x) 
      $("#contbolsas").fadeIn(400) 
      hovercolores(); 
      if ($('#contbolsas > div:contains("Rawr")').length > 0) { 
      $("#text").fadeOut() 
      return false; 
      } 
      else{ 
       $("#text").fadeIn() 
       cargamascoleccion(id) 
      } 




      }, 

      error: function() { 
      //called when there is an error 
      }, 
     }); 

和我的PHP

<?php 
ini_set("display_erros","yes"); 
require('conexionMYSQL.php'); 
$conexion = new connection(); 


$id = $_REQUEST['id']; 

$query ="select b.idBolsa,b.Skuref, b.Descripcion, b.Medidas, c.TipoColeccion, cf.ColorFamilia, tp.TipoBolsa from Bolsas b 
inner join Coleccion c on b.idColeccion = c.idColeccion 
inner join ColoresFamilia cf on b.idColorFamilia = cf.idColorFamilia 
inner join TipoBolsas tp on b.idTipoBolsa = tp.idTipoBolsa 
where c.TipoColeccion = '$id' 
group by tp.TipoBolsa 
order by b.idBolsa DESC limit 0,20"; 
$result= mysql_query($query, $conexion->conn) or die (mysql_error()); 
$cantidadLog = mysql_num_rows($result); 
$json  = ''; 

    if($cantidadLog < 20){ 

     echo "<div id='iku' style='display:none'>Rawr</div>"; 
     while($datos = mysql_fetch_assoc($result)){ 

      echo"<div class='cargabolsas'>"; 
            echo"<div class='bolsacargada pointer' style='' id='".$datos["idBolsa"]."'>"; 
            echo"<p id='titbolsa' style='display:none'>".$datos["TipoBolsa"]."</p>"; 
             echo"<p style='display:none'>".$datos["TipoColeccion"]."</p>"; 
             echo"<p style='display:none'>".$datos["Medidas"]."</p>"; 
             echo"<p style='display:none'>".$datos["Descripcion"]."</p>"; 
             echo"<p><img id='chica' src='images/chicas/".$datos["Skuref"].".jpg'></p><br>"; 
             echo"<p style='display:none'><img src='images/medianas/".$datos["Skuref"].".jpg'></p>"; 
             echo"<p style='display:none'><img src='images/grandes/".$datos["Skuref"].".jpg'></p><br>"; 

              $query2 = "select cf.ColorFamilia, cf.rueditaimagen from Bolsas b 
               inner join Coleccion c on b.idColeccion = c.idColeccion 
               inner join ColoresFamilia cf on b.idColorFamilia = cf.idColorFamilia 
               inner join TipoBolsas tp on b.idTipoBolsa = tp.idTipoBolsa 
               where tp.TipoBolsa = '".$datos['TipoBolsa']."' AND c.TipoColeccion = '".$datos['TipoColeccion']."' 
               group by cf.ColorFamilia"; 

              $result2 = mysql_query($query2, $conexion->conn) or die (mysql_error()); 
              echo "<div class='colores' style='margin-left:20px;margin-top:-20px'>"; 
              while($datos2 = mysql_fetch_assoc($result2)){ 
               echo"<p id= '".$datos2["ColorFamilia"]."'><img style='float:left' src='".$datos2["rueditaimagen"]."'></p>"; 
              } 
              echo"</div>"; 

            echo"</div>"; 
      echo"</div>"; 

     } 
    } 
    else{ 

     while($datos = mysql_fetch_assoc($result)){ 


      echo"<div class='cargabolsas'>"; 
            echo"<div class='bolsacargada pointer' style='' id='".$datos["idBolsa"]."'>"; 
            echo"<p id='titbolsa' style='display:none'>".$datos["TipoBolsa"]."</p>"; 
             echo"<p style='display:none'>".$datos["TipoColeccion"]."</p>"; 
             echo"<p style='display:none'>".$datos["Medidas"]."</p>"; 
             echo"<p style='display:none'>".$datos["Descripcion"]."</p>"; 
             echo"<p><img id='chica' src='images/chicas/".$datos["Skuref"].".jpg'></p><br>"; 
             echo"<p style='display:none'><img src='images/medianas/".$datos["Skuref"].".jpg'></p>"; 
             echo"<p style='display:none'><img src='images/grandes/".$datos["Skuref"].".jpg'></p><br>"; 

              $query2 = "select cf.ColorFamilia, cf.rueditaimagen from Bolsas b 
               inner join Coleccion c on b.idColeccion = c.idColeccion 
               inner join ColoresFamilia cf on b.idColorFamilia = cf.idColorFamilia 
               inner join TipoBolsas tp on b.idTipoBolsa = tp.idTipoBolsa 
               where tp.TipoBolsa = '".$datos['TipoBolsa']."' AND c.TipoColeccion = '".$datos['TipoColeccion']."' 
               group by cf.ColorFamilia"; 

              $result2 = mysql_query($query2, $conexion->conn) or die (mysql_error()); 
              echo "<div class='colores' style='margin-left:20px;margin-top:-20px'>"; 
              while($datos2 = mysql_fetch_assoc($result2)){ 
               echo"<p id= '".$datos2["ColorFamilia"]."'><img style='float:left' src='".$datos2["rueditaimagen"]."'></p>"; 
              } 
              echo"</div>"; 

            echo"</div>"; 
      echo"</div>"; 

     } 

    } 

?> 

因此，繼承人我得到了，你可以在阿賈克斯成功函數I淡入看到問題所有的內容，但我想要做的是淡入每個數據1 1我知道你可以使用。 （數據，函數（key，value）{}）;}。

但如何？

有什麼想法？

Answer 1

我得到了答案，我只是做了我腦子裏浮現的xD的第一件事，但它的工作：

在更迭功能，我決定隱藏我的容器，然後用bolsacargada類改變插入的數據，那麼新的div他們的不透明度爲0，然後使用每個和動畫em。

success: function(x) { 
      $("#contbolsas").css("display", "none"); 
      $("#contbolsas").html(x) 
      $(".bolsacargada").css('opacity', '0'); 
      $("#contbolsas").css("display", "block"); 
      $(".bolsacargada").each(function(index) { 
       $(this).delay(300*index).animate({opacity: 1}, 400); 
      }); 
      hovercolores(); 
      if ($('#contbolsas > div:contains("Rawr")').length > 0) { 
      $("#text").fadeOut() 
      return false; 
      } 
      else{ 
       $("#text").fadeIn() 
       cargamascoleccion(id) 
      } 




      }, 

訣竅這裏是

$(".bolsacargada").each(function(index) { 
        $(this).delay(300*index).animate({opacity: 1}, 400); 
       }); 

由於指數是每bolsacargada它會變成：

300 * 1

300 * 2

300 * 3，等等。