重新加载时在 HTML 文件上保存用户位置

Question

就上下文而言，我正在 Jupyter Notebook 上使用 Python。 我定期更新 HTML 文件的值。

为了能够体验实时结果，我在 Python 代码中封装了一段 Javascript 代码，该代码在 Edge 上打开并加载我的 HTML 文件，并通过函数 start_auto_refresh（见下文）定期自动重新加载它，我将其称为在我的 Python 代码中首先加载它，然后使用函数 stop_auto_refresh 在 Python 代码完成更新我的 HTML 文件值时停止刷新

我有两个问题：

1. 每次重新加载时，它都会丢失 HTML 页面上的用户位置，尽管我编写了代码部分
2. 调用 stop_auto_refresh
时不会停止重新加载

这里有：

• 我的start_auto_refresh和stop_auto_refresh函数

  ``` def start_auto_refresh(html_file, interval):
        js_code = f"""
        <script>
        var refreshInterval;
        var refreshWindow = window.open("{html_file}", "_blank");
        function startRefresh() {{
                if (refreshWindow) {{
                    refreshInterval = setInterval(function() {{
                        // Save the scroll position
                        var scrollPos = refreshWindow.scrollY;
                        refreshWindow.localStorage.setItem("scrollPos", scrollPos);
                        // Reload the window
                        refreshWindow.location.href = "{html_file}";
                        // Restore the scroll position after reload
                        refreshWindow.onload = function() {{
                            var savedScrollPos = refreshWindow.localStorage.getItem("scrollPos");
                            if (savedScrollPos !== null) {{
                                refreshWindow.scrollTo(0, parseInt(savedScrollPos, 10));
                            }}
                        }};
                    }}, {interval});
                }}
            }}
        startRefresh();
        </script>
        """
        display.display(display.HTML(js_code))
    def stop_auto_refresh():
        js_code = """
        <script>
        if (refreshInterval) {{
            clearInterval(refreshInterval);
            refreshInterval = null;
        }}
        </script>
        """
        display.display(display.HTML(js_code))
  

- and my Python code calling for them (for example):

    def run_cdf():
        teams= define_teams()
        [rounds,entering,teams] = define_tournament(teams)
        nbround = rounds[['ID_ROUND']].max().reset_index(name='MAX').iloc[:1].iat[0,1]
        for r in range(1,2):#int(nbround)+1):
            define_HTML_file("games",rounds[rounds['ID_ROUND'] == r])
            path = output_html + "\\round_" +str(r) + ".html"
            path_abs = "CDF_REAL/"+ path.replace("\\","/")
            start_auto_refresh('http://localhost:8888/files/'+ path_abs, 2000)
            [games,teams, rounds] = generate_games(r,rounds, teams)
            define_HTML_file("calculations",rounds[rounds['ID_ROUND'] == r],teams[teams['RANK_FAVOR']> 0].sort_values(by=['RANK_FAVOR'], ascending=[False]))
            path = output_html + "\\round_" +str(r) + ".html"
            path_abs = "CDF_REAL/"+ path.replace("\\","/")
            stop_auto_refresh()        
run_cdf()


Can someone help me with it? Thanks.

Answer 1

1. 确定视口中最顶层的元素，
2. 全局存储或缓存...或者真的，
3. 更新 DOM 或内容...或者真的，
4. 调用

   .scrollIntoView(<element>);

   DOM 函数并传入元素引用。