Question

我正在尝试实现无限滚动，但我遇到了问题。默认情况下，profile_page.php应显示10个帖子，然后当用户到达页面底部时，它应显示数据库中的另外10行。

问题是我知道我的JQuery正在运行，因为当我到达页面底部时发生alert（），但是没有打印数据中的新数据。

这是我的脚本（可以在**profile_page.php**中找到）：

<script>
    $(document).ready(function(){
        var load = 0;
        $(window).scroll(function(){
            if($(window).scrollTop() == $(document).height() - $(window).height()){
                load++;
                // start AJAX
                $.post("inc/ajax.php", {load:load},function (data){
                    $(".userposts_panel").append(data); // images class
                    alert ("bottom");
                });
            }
        });
    });
</script>

这里是**ajax.php**

$load = htmlentities(strip_tags($_POST['load']))*10;
$query = mysqli_query ($connect, "SELECT * FROM user_thoughts WHERE added_by='$user' ORDER BY id DESC LIMIT ".$load.",10");

while ($row = mysqli_fetch_assoc($query)) {
    $thought_id      = $row['id'];
    $message_content = $row['message'];
    $date_of_msg     = $row['post_details'];
    $thoughts_by     = $row['added_by'];
    $attachent       = $row['attachment'];

    echo "<div class='message_wrapper'>
            <div class='where_msg_displayed'>
                <div class='more_options' style='float: right;'>
                    <li class='dropdown'>
                        <a 'href='#' class='dropdown-toggle' data-toggle='dropdown' role='button' aria-haspopup='true' aria-expanded='false'> More <span 
                                                                                                                            class='caret'></span></a>
                        <ul class='dropdown-menu'>
                            <li><a href>Flag Post 
                            <span id='options' class='glyphicon glyphicon glyphicon-flag' aria-hidden='true'></span> </a></li>"; 
                            if ($user == $username){
                                echo "<li>"; ?>   <a href="del_post.php?id=<?php echo $thought_id;?>">Delete <?php
                                echo "<span id='remove' class='glyphicon glyphicon-remove' aria-hidden='true'></span> </a></li>";
                            } echo"
                        </ul>
                    </li>
                </div>
                <img src='$profile_pic' height= '68px' style='border: 1px solid #F0F0F0;'/>
                <span style='margin-left: 10px;'>$message_content </span> <br/> <br/>";
                    if ($attachent !=""){
                        echo "<img src='user_data/attached_images/$attachent' style='width: 230px; height=230px;'/>";
                    } echo "
            </div>
        <div class='where_details_displayed'>
            <a href='profile_page/$thoughts_by'> <b> $name_of_user </b> </a> - $date_of_msg  
            <div class='mini_nav' style='float: right;'>
                <span class='glyphicon glyphicon-heart-empty' aria-hidden='true' style='padding-right: 5px;' onclick='changeIcon()' ></span> |
                <a onclick='return toggle($thought_id);' style='padding-left: 5px;'> View comments ($num_of_comments) </a> 
            </div>
            <div id='toggleComment$thought_id' class='new_comment' style='display:none;'>
                <br/> $comment_posted_by said: $comment_body
            </div>
        </div>
    </div>";

    }

echo由显示每个帖子的div组成。但是当我到达页面末尾时，没有新内容加载。例如，如果用户Alice有12个帖子，默认情况下会显示10个帖子，然后当我向下滚动时，其他两个应该加载，但他们不会。

无限滚动功能的问题 - JQuery工作，但没有加载新数据

0 个答案: