Question

我有这个div框溢出：auto我想用编程方式滚动到顶部和底部。

<ul class="-cx-PRIVATE-PostInfo__comments -cx-PRIVATE-PostInfo__commentsSidebarVariant" data-reactid=".1.1.0.0.2.1">

//html style
.-cx-PRIVATE-PostInfo__comments {
     margin-left: -24px;
     margin-right: -24px;
     margin-top: -5px;
     padding-left: 24px;
     padding-right: 24px;
     padding-top: 5px;
}
.-cx-PRIVATE-PostInfo__commentsSidebarVariant {
     overflow: auto;
     padding-bottom: 20px;
}
.-cx-PRIVATE-PostInfo__comments {
     flex-grow: 1;
}
ol, ul {
     list-style: outside none none;  
}

此方法适用于向下滚动。

jse.executeScript("if ($('.-cx-PRIVATE-PostInfo__comments').scrollTop() != $('.-cx-PRIVATE-PostInfo__comments').outerHeight()) {\n" + 
            "$('.-cx-PRIVATE-PostInfo__comments').animate({scrollTop: $('.-cx-PRIVATE-PostInfo__comments')[0].scrollHeight - $('.-cx-PRIVATE-PostInfo__comments')[0].clientHeight}, 1000);}");

但是有没有办法将代码编写成下面的代码来检查scrollHeight是否等于clientHeight？以下代码不起作用且没有错误。

    //return number of pixels the content of <div> element is scrolled vertically
    Long scrollH = (Long)jse.executeScript("return $('.-cx-PRIVATE-PostInfo__comments').scrollTop()");

    //return outer height of a window, including scrollbars
    Long clientH = (Long)jse.executeScript("return $('.-cx-PRIVATE-PostInfo__comments').outerHeight()");

    //check if scrollTop is equals to clientHeight
    Boolean check = (Boolean)jse.executeScript("return $('.-cx-PRIVATE-PostInfo__comments').scrollTop() != $('.-cx-PRIVATE-PostInfo__comments').outerHeight()");

    int index = 1;
    if(check){
        while(scrollH.intValue() > 0){
            screenshot.capture();
            jse.executeScript("window.scrollTo(0," + clientH * index + ")");    
            scrollH  = scrollH - clientH;
            try{
                    Thread.sleep(4000);
            } catch (InterruptedException e){
                Thread.currentThread().interrupt();  //set interrupt flag
            }
            index++;
        }
    }

Answer 1

您正在使用scrollTo()。我假设你有这个库的参考？（http://lions-mark.com/jquery/scrollTo/）但是，在这种情况下，我认为你不需要它。你说你想滚动div，但你正在瞄准窗口（window.scrollTo（））。你不想成为你的div的目标吗？

$('.-cx-PRIVATE-PostInfo__comments').scrollTop(clientH * index);

更新

为了向你展示一些东西，我创造了一个jsfiddle：https://jsfiddle.net/4fLyz57q/

第一次实际加载时，您会收到一些警报，屏幕上不会显示任何内容。因此，在加载并显示警报后，单击“运行”按钮。警报仅用于向您显示div实际上是滚动。

我已经在您的ul中添加了div作为内容，因此我可以将其推下来。我还在ul上设置了一个高度，它可以滚动。

希望这会有所帮助。我确定你在使用jse将它转换成你真正需要的东西时会遇到太多麻烦。

var scrollH = $('.-cx-PRIVATE-PostInfo__comments').prop('scrollHeight');
var clientH = $('.-cx-PRIVATE-PostInfo__comments').innerHeight();
var index = 1;

while(scrollH > clientH)
{
    //screenshot.capture();
    $('.-cx-PRIVATE-PostInfo__comments').scrollTop(clientH * index);    
    scrollH  = scrollH - clientH;
    alert(scrollH);
    index++;
}

我还从这里注释掉了/删除了服务器代码并将它们应用到js，再一次，只是为了让事情有效。

您的检查变量已被删除。它并不需要在那里，因为while循环条件是检查滚动高度是否大于内部高度。

但是，与您的示例代码一样，如果条件不满足，则根本不会捕获屏幕截图。

在div中向上和向下滚动

1 个答案:

更新