Question

我正在尝试制作一个滚动条，一次仅加载选定数量的元素。可以说我有45个要显示的元素，每个元素只有一行。我想先加载前15个元素，然后滚动，然后加载另一组15个元素，依此类推。

这当前是用.php文件编写的，我正在使用具有以下“设置”的Div

print("<div class='scrolldiv' style='width: 70vw; height: 90vh; overflow-y: scroll; margin-top: 4vh; margin-left: 4vw;'><table><hr><th>Set ID</th><th>Set Name</th><th>Category Name</th></hr> </div>");

所有代码都是在制品（正在进行中）

<?php include("navbar.php"); 
?>

<?php   

    // Cencored the connection :)
    $connection =   mysqli_connect("Database","data","","data");        

    $search = $_GET['search'];


    $limit = $_GET['limit'];
    if ($limit == 0){
    $limit = 13361;
    }
    $counter = 0;



    $result = mysqli_query($connection, 
    "SELECT * FROM sets LIMIT $limit");

    print("<div class='scrolldiv' style='width: 70vw; height: 90vh; overflow-y: 
    scroll; margin-top: 4vh; margin-left: 4vw;'><table><hr><th>Set ID</th> 
    <th>Set Name</th><th>Category Name</th></hr> </div>");  

    while ($row =   mysqli_fetch_array($result)){ 


            $SetID =    $row['SetID'];  
            $Setname =  $row['Setname'];                                                                            
            print(" <div class='row'> <tr>
                    <td>$SetID</td> <td>$Setname</td> 
                    <td>$Quantity</td></tr> </div>");

            $counter = $counter + 1;
            $i = $i + 1;



    }   //  end while

    echo $counter;
    print("</table></div>");
    ?>

</body>

</html>

Answer 1

您必须将用户交互与后端逻辑分开。此问题是用户客户端交互问题。 @flowtron在注释中提到了它，您可以通过使用jquery / javascript和ajax调用动态加载来加载您的php文件，以实现此目的。

话虽如此，我不建议您使用scroll事件触发后端查询，这会影响客户体验。我确实建议创建一个“加载更多”按钮，以便使用ajax调用加载下一批数据。

例如：

$(document).on("click", "load_more", function(e){
var parameters = {"par1":pa1};
$.ajax({
    url: "backend_query.php",
    type: "post",
    data: parameters,
    success: function (response) {
        $("#scroll_div").append("<li>elements from response</li>");
    }
});

}）;

滚动条逐步加载#PHP？

1 个答案: