ajax自动加载（多次调用并获取相同的数据）

Question

When I use this code then multiple time ajax call 4-5 time load same data in output. Please help me to solve this. Please see the flowing code.

<script>
    $(document).ready(function () {
        $(window).scroll(function () {
            if ($(document).height() - 50 <= $(window).scrollTop() + $(window).height()) {
                sendData();
            }
        });

        function sendData() {
            var offset_val = $('#offset_val').val();
            $.ajax({
                url: '',
                type: 'POST',
                data: {offset_val: offset_val},
                dataType: "json",
                success: function (response) {
                    if (response.status) {
                        $('#load_data').append(response.all_data);
                        $('#offset_val').val(response.offsets);
                        setTimeout(function () {
                            //$('.animation_image').hide();
                        }, 600);
                    } else {
                        $('#no-data-found').html(response.all_data);
                       // $('.animation_image').hide();
                    }
                }
            });
        }

    });

</script>

Answer 1

That's not the ajax issue, check the following line:

$(window).scroll(function () {
    if ($(document).height() - 50 <= $(window).scrollTop() + $(window).height()) {
        sendData();
    }
});

The above code executes for each single scroll moment when condition return true. That's why it is initiating multiple request for a single scroll.