0

嗨,我目前正在开发这个网站:

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

它几乎完成了,但我目前在本节中的“Coleccion”部分有些麻烦你要做的第一件事是选择特定类型的包,一旦你选择它,你只会得到 20 个包(这个包是从一个mysql db)当您到达页面底部时,它将显示另外 20 个袋子。现在这里的问题是,当我到达底部时,JS 函数会运行 5 次:/ 那么有没有一种方法它只运行一次,然后稍等片刻再运行一次?

这是我的 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 回答