一、JS關閉當前窗口事件
在 JavaScript 中,可以使用 window.close() 方法來關閉當前窗口,這個方法可以被調用在一個窗口的任何 JavaScript 代碼中。在 HTML 中,可以使用一個按鈕或者鏈接來調用這個方法,從而關閉當前窗口。
例如,下面這個 HTML 代碼片段展示了如何在一個鏈接中調用 window.close() 方法來關閉當前窗口:
<a href="#" onClick="window.close();">關閉窗口</a>
二、JS關閉當前窗口的方法
JavaScript 中,可以使用 window.close() 方法來關閉當前窗口。在實際應用中,我們可以將此方法封裝成一個函數調用,以便復用。
function closeWindow() { window.close(); }
這樣,我們就可以在任何需要關閉當前窗口的代碼段中直接調用這個函數:
closeWindow();
三、關閉當前窗口下載
有時候,我們需要在關閉當前窗口之前,先下載一個文件。我們可以在下載完文件之後,再通過 JavaScript 的 window.close() 方法來關閉當前窗口。
例如,下面這個 HTML 代碼片段展示了如何在一個按鈕中實現下載文件和關閉當前窗口的功能:
<button onClick="downloadFile();">下載並關閉</button> <script> function downloadFile() { // 下載文件的代碼 window.close(); // 下載完成後關閉當前窗口 } </script>
四、JS關閉當前窗口提示樣式
有時候,在關閉當前窗口之前,我們需要給用戶一個提示,讓他們確認是否真的要關閉窗口。這可以使用 JavaScript 提供的 confirm() 方法來實現。
例如,下面這個 HTML 代碼片段展示了如何在一個按鈕中調用 confirm() 方法來提示用戶確認是否真的要關閉當前窗口:
<button onClick="closeWindow();">關閉</button> <script> function closeWindow() { if (confirm("確定要關閉窗口嗎?")) { window.close(); } } </script>
在這個代碼片段中,當用戶點擊按鈕時,會彈出一個帶有提示信息的對話框,用戶可以點擊“確定”或者“取消”來確認是否真的要關閉窗口。
五、JS關閉當前窗口不管用
在某些情況下,我們可能會發現調用 window.close() 方法並不能成功地關閉當前窗口。這可能是因為當前窗口是通過 JavaScript 打開的,而不是通過用戶手動點擊瀏覽器的關閉按鈕。
一個比較簡單的解決方案是讓當前窗口打開的代碼所在的頁面調用 window.close() 方法。例如,下面這個代碼展示了如何在父窗口中關閉當前窗口:
<a href="javascript:void(0);" onClick="window.open('http://www.example.com');">打開 Example 網站</a> <script> function closeChildWindow() { myWindow.close(); } var myWindow = window.open("http://www.example.com"); myWindow.onunload = closeChildWindow; </script>
在這個代碼片段中,當用戶點擊鏈接時,會彈出一個新的窗口並打開 Example 網站。當該新窗口關閉時,會調用 closeChildWindow() 方法來關閉父窗口。
六、JS關閉當前窗口刷新父窗口
在某些情況下,當關閉當前窗口之後,需要刷新父窗口。這可以通過調用父窗口的 location.reload() 方法來實現。
例如,下面這個代碼片段展示了如何在關閉當前窗口之後刷新父窗口:
var timer = window.setTimeout(function() { window.close(); window.opener.location.reload(); }, 5000);
在這個代碼片段中,當 timer 計時器到期時,會先關閉當前窗口,再通過 window.opener.location.reload() 方法來刷新父窗口。
七、jQuery關閉當前窗口
除了使用 JavaScript 原生提供的 window.close() 方法外,還可以使用 jQuery 中提供的 close() 方法來關閉當前窗口。
例如,下面這個代碼片段展示了如何在一個按鈕中使用 jQuery 來關閉當前窗口:
<button id="closeBtn">關閉</button> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> $("#closeBtn").click(function() { window.close(); }); </script>
八、JS關閉當前標籤頁
有時候,我們需要關閉當前標籤頁而不是整個瀏覽器窗口。可以使用 JavaScript 的 window.close() 方法來關閉當前標籤頁,但是只有在當前標籤頁是通過 JavaScript 打開的情況下才有效。
例如,下面這個代碼片段展示了如何在關閉當前標籤頁之前判斷當前標籤頁是否是通過 JavaScript 打開的:
function closeCurrentTab() { if (window.opener) { window.open("about:blank", "_self").close(); } else { window.close(); } }
在這個代碼片段中,如果當前標籤頁是通過 JavaScript 打開的,則會打開一個新的空白頁面並關閉當前標籤頁。否則,會調用 window.close() 方法來關閉當前標籤頁。
九、JS關閉彈窗
在某些情況下,我們需要在彈窗中添加關閉按鈕或者在彈窗中調用 window.close() 方法來關閉彈窗。
例如,下面這個代碼片段展示了如何在彈窗中添加關閉按鈕來關閉彈窗:
<button id="closeBtn">關閉</button> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> $("#closeBtn").click(function() { window.close(); }); </script>
在這個代碼片段中,當用戶點擊關閉按鈕時,會調用 window.close() 方法來關閉彈窗。
十、JS關閉瀏覽器窗口
在某些情況下,我們需要關閉整個瀏覽器窗口而不僅僅是當前標籤頁或者彈窗。這可以使用 JavaScript 的 window.close() 方法來實現。
例如,下面這個代碼片段展示了如何在一個按鈕中調用 window.close() 方法來關閉整個瀏覽器窗口:
<button onClick="closeBrowserWindow();">關閉瀏覽器窗口</button> <script> function closeBrowserWindow() { window.open("", "_self"); window.close(); } </script>
在這個代碼片段中,當用戶點擊按鈕時,會打開一個新的空白頁面,並通過 window.close() 方法來關閉整個瀏覽器窗口。
原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-hant/n/188344.html