0

以下のスクリプトを使用して、ボタンをクリックして次の投稿を読み込みます。

  jQuery('#showMore').click(function(event) {
       if (jQuery('#loader1').length) {
        jQuery('#loader1').hide();
       }
      jQuery('#showMore').text('Loading..');
      jQuery('#showMore').after('<img src="/wp-content/plugins/store/images/co/ajax-loader.gif" id="loader1">');
      if (jQuery('#no-more').length) {
       jQuery('#no-more').remove();
       }
         event.preventDefault();
         $number = jQuery('#product_grid li').length;

        jQuery.ajax({
           type: "POST",
           url: "/wp-content/plugins/store/ajax_more.php",
           data: "count=" + jQuery('#product_grid li').size(),
           success: function(results){
             jQuery('#product_grid').append(results);
             jQuery('#showMore').text('View More Products');
             jQuery('#loader1').hide();
           }
         });

  });

今、私はスクリプトがボタンをクリックする代わりにスクロールで次の投稿をロードすることを望みました。これを行う方法はありますか?

4

2 に答える 2

0

jQuery(window).scroll イベントを使用します。

例 :

jQuery(window).scroll(function(){
   // existing stuff
});

scrollTop プロパティに従ってロード データ コールバックを制御できます。スクロール量に応じて、現在の $.ajax リクエストがいつ呼び出されるかを意味します。

于 2012-10-15T18:07:01.867 に答える
0
$(window).unbind(‘scroll’);  
if($(window).scrollTop() == $(document).height() - $(window).height()) {  
  //send request based on your cursor if more data available.  
}  
于 2012-10-15T18:12:02.693 に答える