Javascript 如何使用jQuery显示隐藏在滚动条下面的消息的计数？

我需要在对话屏幕中显示已加载但向下滚动消息的计数器。假设总共有15条消息，但现在浏览器上只显示6条。这意味着9条信息隐藏在下面，所以计数器应该显示9。但当我向上或向下滚动时，计数器应该相应地改变可见和隐藏消息的值

        function isScrolledIntoView(elem) {
         var $elem = $(elem);
        var $window = $(window);

        var docViewTop = $window.scrollTop();
            var docViewBottom = docViewTop + $window.height();

            var elemTop = $elem.offset().top;
            var elemBottom = elemTop + $elem.height();

        return ((elemBottom <= docViewBottom) && (elemTop >=        docViewTop));
        }
            var message = $('#messages');
            $(window).scroll(function() {
        if (isScrolledIntoView('#hiddenElem')) {
      message.text("Visible");
        } else {
      message.text("Invisible");
    }
  });

函数是crolledintoview（elem）{
变量$elem=$（elem）；
变量$window=$（window）；
var docViewTop=$window.scrollTop（）；
var docViewBottom=docViewTop+$window.height（）；
var elemTop=$elem.offset（）.top；
var elemBottom=elemTop+$elem.height（）；
返回（（elemBottom=docViewTop））；
}
var message=$（“#messages”）；
$（窗口）。滚动（函数（）{
if（isScrolledIntoView（'hiddenElem'））{
信息文本（“可见”）；
}否则{
消息文本（“不可见”）；
}
});

---

签入代码。还包括为显示隐藏或可见元素编写的JavaScript代码。

您必须将每条消息的位置与滚动值进行比较。
所以你需要在它们之间循环

以下是一些有效的方法：

var messages=$(".msg");

$(window).scroll(function(){
  var counter=0;
  for(i=0;i<messages.length;i++){
    if( messages.eq(i).offset().top < $(window).scrollTop() ){
      counter++;
    }
  }
  // Display result.
  $("#messages").html(counter);
});

var messages=$（“.msg”）；
$（窗口）。滚动（函数（）{
var计数器=0；
对于（i=0；iif（$（'.msg'）.is（“：visible”）{alert（$（'.msg'）.length）}这将显示所有可见的一条，我们可以为它指定一个父div和高度吗？你能在我的小提琴中更新吗？对不起，它向我显示36条意味着总消息。我只需要显示屏幕下方不可见消息的计数。请参阅此感谢Hema的帮助。今天学习了一些新知识。一个困惑是计数器是多少记住这里？不是。在每个
滚动
事件中，计数器重置为零，循环再次计数。