1

私は次のようなスクロールステップで製品を取得するためのコードを作成しようとしています 1 ] 製品を検索 2 ] 1 つの div で結果を取得 3 ] 結果 div のスクロールで次の製品が必要

しかし、すべての検索ヒットとスクロール製品で何が起こっているのか一度に多くのajaxリクエストを呼び出す必要があります。

私のjQueryコードは

 jQuery("#product_search_filter").submit(function () {
   jQuery(".load_more_result").remove();
    jQuery.ajax({
        url: ajaxurl,
        type: "post",
        data: jQuery(this).serialize(),
        dataType: "json",
        success: function (products) {
            var load_more = 0;
            jQuery(".right_bar_sub_inner").html("");
            jQuery.each(products, function (i, data) {
                if (this.image) {
                    jQuery(".right_bar_sub_inner").append('<div class="product_show" alt="' + i + '"> <img class="right_bar_img size-auto" src="' + this.image + '" title="'+ this.title +'"> </div>');
                }
            });
            jQuery(".right_bar_sub_inner").append("<div class='load_more_result'>Load More...</div>");
            var start = false;

            jQuery(".right_bar_sub").scroll( function(){
                var _data = jQuery("#product_search_filter").serialize();
                _data += "&offset=" + load_more;
                jQuery(".load_more_result").css('opacity','0.1');                                            
                jQuery.ajax({
                    url: ajaxurl,
                    type: "post",
                    data: _data,
                    dataType: "json",
                    success: function (products) {
                        jQuery.each(products, function (i, data) {
                            if (this.image) {
                                jQuery(".load_more_result").before('<div class="product_show" alt="' + i + '"> <img class="right_bar_img size-auto" src="' + this.image + '" title="'+ this.title +'"> </div>');
                            }
                        });
                        jQuery(".load_more_result").css('opacity','1');
                        start = false;
                    }
                });
                return false;
            });
        }
    });
    return false;
});

その問題は Lamp-databaseで確認できます

もう一度検索してみると、firebug のコンソールで確認できます。最初は、スクロールで 1 つのリクエストだけが呼び出されていることがわかります。もう一度検索すると、2 つのリクエストが呼び出されています。

等々...

4

1 に答える 1