Php jqueryajax在滚动时加载数据，但在触底时出现故障

每当用户点击页面底部时，我使用JQuery将另一个文件中的数据加载到页面上（这些页面是PHP文件）

但是，当没有更多的数据留下时（例如，当数据库中所有请求的数据都显示出来时），用户滚动到底部时，它会开始出现故障，并无缘无故地不断在页面上下移动这些数据

为什么会发生这种情况

JQuery：

                $(document).ready(function() {
                    var count = ($(".data").length + 10);
                    $(window).scroll(function() {
                        if($(window).scrollTop() == $(document).height() - $(window).height()) {
                            // This loads ten more pieces of data
                            $("#data").load("data.php?v=" + count)
                        }
                    });
                });

Data.PHP

<?php

session_start();

include_once 'db.php';

$v = $_GET['v'];

$username = $_SESSION['username'];

echo '<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var count = ($(".data").length + 10);
        $(window).scroll(function() {
            if($(window).scrollTop() == $(document).height() - $(window).height()) {

                   $("#data").load("data.php?v=" + count)
            }
        });
    });
</script>';

$arr = mysqli_fetch_all(mysqli_query($conn, "SELECT * FROM data"));

for ($i = 0; $i < count($arr) && $i < $v; $i++) {
    $id = $arr[$i][0];
    echo functIMadeForDisplayingData($id)
}

---

我不确定这里可能存在什么问题，但当我注意到我的一些元素具有类似ID时，我经历了这种行为。我不确定这里可能存在什么问题，但当我注意到我的一些元素具有类似ID时，我经历了这种行为
<?php

echo "<div id='data'></div>";
echo '<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var count = 10;
        $(window).scroll(function() {
            if($(window).scrollTop() == $(document).height() - $(window).height()) {
                   $("#data").load("data.php?v=" + count)
            }
        });
    });
</script>';