0

こんにちは私は現在このサイトを開発しています:

http://remedia-solutions.com/clientes/0039_kiplingmexico/demo2/

ほぼ完了しましたが、現在このセクションの「Coleccion」セクションで問題が発生しています。最初に行うことは、特定のタイプのバッグを選択することです。これを選択すると、20個のバッグしかロードされません(このバッグは、 mysql db)ページの下部に到達すると、さらに20個のバッグが表示されます。ここでの問題は、一番下に到達すると、JS関数が5回実行されることです:/では、1回だけ実行してから、少し待ってからもう一度実行する方法はありますか?

これが私のJqueryコードです

「Coleccion」をクリックすると、次のようになります。

$("#coleccionmenu span").click(function() {
        $("#coleccionmenu span").removeClass('focuscoleccion')
        $(this).addClass('focuscoleccion');
        $("#contbolsas").fadeOut('fast')
        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)
            $(".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)
            }




            },

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


});

ロードされたら、クリックしたコレクションのIDが必要なので、下にスクロールすると、それらのコレクションのみが表示され、他のコレクションは表示されません。

function cargamascoleccion(id){




        $("#todocoleccion").scroll(function() {



            var bottom = $("#todocoleccion").scrollTop() - $(window).height();

            if( bottom > $(".bolsacargada:last").offset().top + 300 ){

                $.ajax({
                  url: "respuestabolsas2.php",
                  type: "POST",
                  data: "id=" + id + "&idultimabolsa=" + $(".bolsacargada:last").attr('id'),

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

                  success: function(x) {
                    hovercolores();
                   if(x != ""){

                        $("#contbolsas").append(x)


                   }
                    else{
                        $("#text").fadeOut()
                        return false;
                    }   

                 },

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


        }

phpコードに問題があるのではないかと思います。問題は上記の関数にあると思います。これは、最後のバッグのオフセットに到達したときに4回実行されるためです。何か案は?

4

1 に答える 1

1

ユーザーがスクロールしているときに条件が複数回満たされるため、ajax呼び出しを複数回実行しているように見えます。すでに開始されているかどうかをチェックするajax呼び出しを実行する前に、ifステートメントに別の条件を追加することをお勧めします。の線に沿った何か

var ajaxComplete = true;
$("#todocoleccion").scroll(function() {



    var bottom = $("#todocoleccion").scrollTop() - $(window).height();

    if (bottom > $(".bolsacargada:last").offset().top + 300 && ajaxComplete) {

        $.ajax({
            url: "respuestabolsas2.php",
            type: "POST",
            data: "id=" + id + "&idultimabolsa=" + $(".bolsacargada:last").attr('id'),
            beforeSend: function() {
                ajaxComplete = false
            },
            complete: function() {
                //called when complete
                ajaxComplete = true;
            },

            success: function(x) {
                hovercolores();
                if (x != "") {

                    $("#contbolsas").append(x)


                }
                else {
                    $("#text").fadeOut()
                    return false;
                }

            },

            error: function() {
                //called when there is an error
            },
        });
    }
});​
于 2012-07-03T22:25:37.867 に答える