0

嗨，我目前正在尝试淡入我从 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>";

        }

    }

?>

所以这是我遇到的问题，正如您在 ajax 成功功能上看到的那样，我淡入所有内容，但我想做的是逐个淡入每个数据，我知道您可以使用。

$.each(data,function(key, value){});

但如何？

有任何想法吗？

4

1 回答 1

1

我得到了答案，我刚做了我想到的第一件事 xD，但它奏效了：

在 succes 函数上，我决定隐藏我的容器然后插入数据，然后带有 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);
                });

由于 index 是每个 bolsacargada 它会变成：

300*1

300*2

300* 3 等

于 2012-07-03T18:48:14.407 回答