Javascript 在可滚动div中查找表行数

我在一个可滚动的div中有500行的表格。我如何知道当前有多少行显示在div的视口中

---

我的目标是在更新后对表进行部分更新，并在滚动时进行其余更改。

一旦您在一行中单击索引，然后更改数据，就可以使用AJAX调用返回的数据修改页面上的行：

 function modifyCell(data) {
   var row = $("#tblResults tbody tr").eq(rowIndex);  //index set with the click
   var cell = $(row).children('td').eq(6);  // column to change
   $(cell).html(data);  //modify cell user sees.
 }

---

您需要比较

scrollTop（）

和

offset（）.top

以确定哪些行位于div区域中

---

boundTop：“视口”的起始位置 boundBottom：“视口”结束的位置

var boundTop = div.scrollTop()
var boundBottom = div.scrollTop() + div.height()

trOffset：每行的位置

var trOffset=$（“表tr”）.offset（）.top

---

在

滚动

事件中，如果

trOffset

介于

boundTop

和

boundBottom

之间，则检查每一行，然后可以向该行添加一个类（

.active

，例如），最后可以更新每一行

。active

行：

    $("table tr").each(function () {
        trOffset = $(this).offset().top;
        if ((trOffset > boundTop) && (trOffset < boundBottom)) {
            $(this).addClass("active");
            $("td", this).stop().animate({
                "padding": "4px 10px 4px 30px"
            }, "fast");

        } else {
            $(this).removeClass("active");
            $("td", this).stop().animate({
                "padding": "4px 30px 4px 10px"
            }, "fast");
        }
    });

$（“表tr”）。每个（函数（）{
trOffset=$（this）.offset（）.top；
如果（（trOffset>boundTop）&（trOffset

---

---

您需要迭代可见的每一行

这是小提琴-

函数可见（行、容器）{
var elementTop=$（行）.offset（）.top，
elementHeight=$（行）.height（），
containerTop=$（容器）.offset（）.top，
containerHeight=$（container）.height（）；
返回（（（elementTop-containerTop）+elementHeight）>0）和（（（elementTop-containerTop）

向我们展示您没有尝试过的内容。我不知道如何处理。您可以从查看

div

的

.scrollTop（）

和每行的高度开始。您是在用JS还是jQuery来执行此操作？您需要在每行中设置一个索引，并使用它来更改该行中的数据。

function isVisible( row, container ){

    var elementTop = $(row).offset().top,
        elementHeight = $(row).height(),
        containerTop = $(container).offset().top,
        containerHeight = $(container).height();

    return ((((elementTop - containerTop) + elementHeight) > 0) && ((elementTop - containerTop) < containerHeight));
}