无限滚动复制ajax

Question

Some time when I refresh the page and scroll right the page loading it will duplicates the items. I'm using this code:

$(document).ready(function () {
    $('[data-toggle="tooltip"]').tooltip();
    //** My deals pagination starts**//
    var my_track_load = 0; //total loaded record group(s)
    var my_loading = false; //to prevents multipal ajax loads
    var my_total_groups = <? php echo $my_total_groups; ?> ; //total record group(s) 
    $('#load_deals').load("ajax/autoload_process.php", {
        'group_no': my_track_load,
        'my_deals': 'my_deals'
    }, function (data) {
        ++my_track_load;
    }); //load first group

    $(window).scroll(function () { //detect page scroll
        // if($(window).scrollTop() + $(window).height() == $(document).height())  //user scrolled to bottom of the page?
        //{
        if (my_track_load <= my_total_groups && my_loading == false) //there's more data to load
        {
            my_loading = true; //prevent further ajax my_loading
            $('.animation_image').show(); //show my_loading image
            //load data from the server using a HTTP POST request
            $.post('ajax/autoload_process.php', {
                'group_no': my_track_load,
                'my_deals': 'my_deals'
            }, function (data) {
                $("#load_deals").append(data); //append received data into the element
                //hide my_loading image
                $('.animation_image').hide(); //hide my_loading image once data is received
                my_track_load++; //loaded group increment
                my_loading = false;
            }).fail(function (xhr, ajaxOptions, thrownError) { //any errors?

                alert(thrownError); //alert with HTTP error
                $('.animation_image').hide(); //hide my_loading image
                my_loading = false;
            });
        }
        // }
    });
    //** My deals pagination Ends**//

    //** All deals pagination starts**//
    var track_load = 0; //total loaded record group(s)
    var loading = false; //to prevents multiple ajax loads
    var total_groups = <? php echo $total_groups; ?> ; //total record group(s) 
    var country = '<?php echo $country; ?>';
    var state = '<?php echo $state; ?>';
    $('#results').load("ajax/autoload_process.php", {
        'group_no': track_load,
        'country': country,
        'state': state,
        'all_deals': 'all_deals'
    }, function (data) {
        ++track_load;
    }); //load first group

    $(window).scroll(function () { //detect page scroll
        // if($(window).scrollTop() + $(window).height() == $(document).height())  //user scrolled to bottom of the page?
        //{
        if (track_load <= total_groups && loading == false) //there's more data to load
        {
            loading = true; //prevent further ajax loading
            $('.animation_image').show(); //show loading image
            //load data from the server using a HTTP POST request
            $.post('ajax/autoload_process.php', {
                'group_no': track_load,
                'country': country,
                'state': state,
                'all_deals': 'all_deals'
            }, function (data) {
                $("#results").append(data); //append received data into the element
                //hide loading image
                $('.animation_image').hide(); //hide loading image once data is received
                track_load++; //loaded group increment
                loading = false;
            }).fail(function (xhr, ajaxOptions, thrownError) { //any errors?
                alert(thrownError); //alert with HTTP error
                $('.animation_image').hide(); //hide loading image
                loading = false;
            });
        }
        // }
    });
});

Answer 1

I don't know if it helps you or not but below code might guide you somewhere.

function FeedLoader(my_track_load,my_total_groups){

$.ajax({            
    url:'ajax/autoload_process.php',
    type:"POST", 
    dataType:"text", 
    data:'my_track_load='+my_track_load+'&my_total_groups='+my_total_groups,                
    cache: false, 
    async: true, 
    success: function(data){
        if(my_track_load == 0)
            {
                $(""#load_deals"").html(data);                  
            }
        else
            {
                $(""#load_deals"").append(data);
            }           
    }, 
    complete: function(){                       
        $(window).on("scroll",function(){   
            var closeToBottom = ($(window).scrollTop() + $(window).height() > $(document).height() - 500);
            var AtBottom = ($(window).scrollTop() + $(window).height() == $(document).height());            
            if (closeToBottom || AtBottom)  
                {       
                    if( my_track_load < total_m_group )
                        {   
                            my_track_load++;
                            FeedLoader(my_track_load,total_m_group);
                        }                   
                }   
        });
    },              
    error:function (xhr, ajaxOptions, thrownError){                
        alert(thrownError);
    }
}); }

$(document).ready(function () {
 FeedLoader('0','<?php echo $my_total_groups;?>'); });