首頁 > web前端 > js教程 > 主體

如何使用 JavaScript 關閉瀏覽器視窗中的目前標籤?

WBOY
發布: 2023-09-15 21:21:07
轉載
663 人瀏覽過

如何使用 JavaScript 关闭浏览器窗口中的当前选项卡?

我們將在本教學中學習使用 JavaScript 關閉瀏覽器視窗。假設用戶在 2 個分頁中開啟了您的網站並且不想允許它,那麼您可以使用 JavaScript 自動關閉一個選項卡。

此外,如果您注意到某些網路應用程式會自動開啟瀏覽器視窗來擷取臉部,那麼當您透過點擊按鈕擷取影像時,它會自動關閉。這就是我們使用 JavaScript 所能做的一切。

本教學將教導使用 JavaScript 關閉瀏覽器視窗中目前標籤的不同範例。

注意 - JavaScript 永遠不允許開發人員關閉使用者開啟的視窗。這是由於一些安全問題。所以,程式設計師只能關閉使用JavaScript的open()方法開啟的瀏覽器視窗。

文法

您可以依照下列語法使用close()方法關閉瀏覽器視窗。

let new_window = window.open(URL, width, height);
new_window.close();
登入後複製

在上面的語法中,我們在建立 new_window 變數時將回傳值儲存在其中。之後,我們使用 close() 方法關閉新開啟的視窗。

範例

在這個例子中,我們有兩個按鈕;一個是開啟新選項卡,另一個是關閉使用 JavaScript 開啟的新分頁。

用戶首先需要透過點擊「開啟新分頁」按鈕使用 JavaScript 開啟選項卡。他們可以單擊“關閉新選項卡”按鈕後,觀察它會自動關閉該選項卡。

<html>
<body>
   <h2>Using the <i>window.close()</i> method to close the browser's tab</h2>
   <p>Click "Open New Tab" to open a page in new tab and click "Close New Tab" to colse the opened tab</p>
   <button id = "openTab" onclick = "openTab()">Open New Tab </button><br><br>
   <button id = "closeTab" onclick = "closeTab()">Close New Tab</button>
   <script>
      // creating the variable to store the tab
      var new_tab;
      function openTab() {
         // open a new tab
         new_tab = window.open("https://www.tutorialspoint.com/answers/shubham-vora");
      }
      function closeTab() {
         // close tab
         new_tab.close();
      }
   </script>
</body>
</html>
登入後複製

範例

在下面的範例中,我們建立了兩個按鈕,如上面的範例,用於開啟和關閉選項卡。但是,在本範例中,我們還新增了「_blank」作為 open 方法的參數,這將開啟一個新視窗而不是新分頁。

接下來,使用者可以點擊新視窗按鈕來關閉彈出視窗。

<html>
<body>
   <h2>Using the <i>window.close() method</i> to close the browser's window.</h2>
   <p>Click "Open New Window" to open the page in new window and click "Close New Window" to colse the opened window</p>
   <button id = "openWidnow" onclick = "openWindow()"> open new Window</button><br><br>
   <button id = "closeWidnow" onclick = "closeWindow()">Close new Window</button>
   <script>
      // creating the variable to store window
      var new_window;
      function openWindow() {
         // open a new window
         new_window = window.open("https://www.tutorialspoint.com/index.htm", "_blank", "width=800");
      }
      function closeWindow() {
         // close the window
         new_window.close();
      }
   </script>
</body>
</html>
登入後複製

因此,使用者學習使用 JavaScript 開啟新分頁或視窗。此外,還學習了使用 close() 方法關閉選項卡或視窗。

此外,我們還可以開啟新視窗來接受使用者輸入,當使用者提交表單資料時,我們可以在處理表單資料的函數中呼叫 close() 方法。

以上是如何使用 JavaScript 關閉瀏覽器視窗中的目前標籤?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:tutorialspoint.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板