Created
December 9, 2021 09:21
-
-
Save relyky/83737ae9d8ddcb6d0857a7e5fe51d342 to your computer and use it in GitHub Desktop.
html5, 判斷介面已過期,同時開啟多個 tabpage 時只留用最新開啟的介面。expires UI, tabpage
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Page Title</title> | |
</head> | |
<body> | |
<h1>This is a Heading</h1> | |
<p>This is a paragraph.</p> | |
<p id="message">Click on this document to give it focus.</p> | |
<input type="text" /> | |
<script> | |
//## 判斷介面已過期,同時開啟多個 tabpage 時只留用最新開啟的介面。 | |
// 需 html5,ES6 以上版本 | |
window.addEventListener('load', (event) => { | |
const now = Date.now(); | |
sessionStorage.setItem('loadtime', now); | |
localStorage.setItem('loadtime', now); | |
}); | |
window.addEventListener('focus', (event) => { | |
if(!document.getElementById('blackscreen')) | |
{ | |
const sessionLoadTime = sessionStorage.getItem('loadtime'); | |
const localLoadTime = localStorage.getItem('loadtime'); | |
if(sessionLoadTime < localLoadTime) | |
{ | |
const blackscreen = document.createElement('div'); | |
blackscreen.style = "position:fixed;display:block;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:99999;cursor:pointer;"; | |
blackscreen.innerHTML = "<H1 style='color:red;text-align:center;'>介面已過期</H1>"; | |
blackscreen.id = 'blackscreen'; | |
document.body.appendChild(blackscreen); | |
} | |
} | |
}); | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment