Question

我是JQuery的新手，无法处理我如何做到这一点。我的数据库中有一个名为user_thoughts的表。我正在尝试实现无限滚动功能，当用户的alert("bottom")超过10时，该功能应为thoughts。

每个用户都可以上传thought并在profile_page上，只显示他们的想法。默认情况下，我需要显示10个帖子，然后当用户滚动到页面底部时，它会自动加载用户编写的10个帖子。

这是我的 infinity_scroll 脚本：

$(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); //  class
                alert ("bottom");
            });
        } // if closed
    });
});

我需要一个围绕alert()的if语句，它就像这样 - if the user has over 10 posts and the user has scrolled to the bottom, then display more data - 现在，我只是使用alert（）进行测试。例如，如果用户仅发布了2个帖子，并且用户滚动到底部，则不应出现alert()。

我的想法是，我需要一个var来获取用户的帖子数量，然后用户指定那个条件，例如

  if (posts >=10){ 
      alert("bottom");
  }

这是最好的方法吗？如果没有，我应该采用什么方法？

修改

如何显示每一行（单个帖子）：

  <div class=userposts_panel>
<?php 
// PHP query here, leading to this echo ...
    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="/inc/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>";
                    if ($shared == "no"){
                        echo "<img class='img-size' src='images/anomolous.jpg' />";
                        } else {
                            echo "<img class='img-size' src='$profile_pic2'/>";
                        }
                     echo "<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;'>
                     <a href='/inc/favourite_post.php?id=";?><?php echo $thought_id;?><?php echo "'>
                        <span class='glyphicon glyphicon-heart-empty' aria-hidden='true' style='padding-right: 5px;' onclick='changeIcon()'></span> 
                     </a> |
                    <a onclick='return toggle($thought_id);' style='padding-left: 5px;'>  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>";
     ?> 
    </div> // userposts_panel closed.

Answer 1

您可以通过计算页面中显示的特定类别的元素数量来获取帖子的长度，例如假设你使用包装类'postRowWrap'来显示每个帖子，然后

var postLen = $('.userposts_panel').find('.postRowWrap').length

可以为您提供当前视频数量的长度。

如果您使用的是<table>，那么

var postLen = $(".userposts_panel").find('tr').length

可以为您提供视野中的帖子长度。

现在你可以这样做：

if(postLen > 10){alert()}

编辑：啊，从我的结束有点晚，但在你的情况下得出结论 -

postLen = $(".userposts_panel").find('.message_wrapper').length //which is, in the wrapper class find number of .message_wrapper which signifies number of messages you have as DOM in your HTML

将为您提供页面中消息数量的长度。希望这可以帮助。：）

如何将行数作为JQuery变量

1 个答案: