3

我有一个需要实时跟踪的日志:

        <h:panelGroup layout="block" style="width:100%; max-height: 400px; overflow: auto;" id="log" styleClass="logArea">
            <h:outputText value="#{myBean.log}" style="white-space:pre;"></h:outputText>
        </h:panelGroup>
        <h:outputScript>
        function scrollLog() {var log=jQuery('.logArea');log.scrollTop(log.scrollHeight-log.height);};</h:outputScript>
        <p:remoteCommand name="getLog" process="@this" update="log" onsuccess="scrollLog();">
        </p:remoteCommand>

虽然在 remoteCommand 运行后日志输出更新得很好,但它不会滚动到底部。我怀疑我的 scrollLog() 在应用部分更新之前被调用,并且更新将滚动条重置到顶部。

我还尝试了以下 jQuery 代码:

jQuery( function() { var log=jQuery('.logArea');log.animate({ scrollTop: log.scrollHeight}, 1000); });

但似乎没有任何效果。

我该如何解决这个问题并在每次更新后滚动到日志底部?

4

1 回答 1

2

在成功检索到 ajax 响应之后,但在基于 ajax 响应更新 DOM之前直接onsuccess调用处理程序。

您想改用oncomplete处理程序。

<p:remoteCommand ... oncomplete="someFunctionWhichNeedsToWorkWithUpdatedDOM()" />
于 2013-06-04T14:51:16.393 回答