強制網頁加載到頁面頂部

Question

我有一個 html 頁面，其中有幾個IFrame通過外部源代碼加載。 我無法控制外部資源。

當網頁加載時，它會關注IFrame之一，而不是關注頁面頂部。

這是我的簡單 html 頁面：

<html>
   <head>
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
      <div id="topp" tabindex="0"></div>
   </head>
   <div id="topp" tabindex="0"></div>
   <body>
      <p id="test">test 1 2 3 4.</p>
      <br><br>
      <h2>IFrame 1</h2>
      <iframe src="https://..../index1.html" width="100%" height="825px;"></iframe>
      <iframe src="https://..../index2.html" width="100%" height="825px;"></iframe>
      <iframe src="https://..../index3.html" width="100%" height="825px;"></iframe>
      <iframe src="https://..../index4.html" width="100%" height="825px;"></iframe>
   </body>
</html>

它專注於Iframe index3.html ，因此我嘗試通過在頁面正文中包含一些 javascript 來創建解決方法。 通過這種方式，我可以在渲染 DOM 時強制頁面滾動回頂部。 但它不起作用。

這是我嘗試過的：

$(document).ready(function(){
    $(this).scrollTop(0);
});

有沒有辦法找到IFrame加載所有 SRC，然后關注頁面頂部？

Answer 1

您可以將 JavaScript 代碼替換為：

window.scrollTo(0, 0);

該行代碼將在加載后強制頁面滾動到頂部。

您可以使用以下代碼添加平滑滾動：

window.scroll({
  top: 0, 
  left: 0, 
  behavior: 'smooth',
});

我希望這有幫助。

強制網頁加載到頁面頂部

問題描述

1 個解決方案

解決方案1
1 2019-11-11 19:03:01

強制網頁加載到頁面頂部

問題描述

1 個解決方案

解決方案1 1 2019-11-11 19:03:01

解決方案1
1 2019-11-11 19:03:01