這是我撰寫的腳本，我想在用戶切換到不同的選項卡時停止計時器并在訪問該站點時恢復。誰能幫我解決這個任務。當瀏覽器選項卡焦點或在選項卡之間切換時需要停止計時器倒計時任何人都可以幫助我處理此代碼
<div style="text-align: center;">
<a class="button" href="" id="download">Click To Download</a>
<button class="infoblogger" id="btn"> Download</button>
<script>
var downloadButton = document.getElementById("download");
var counter = 45;
var newElement = document.createElement("p");
newElement.innerHTML = "www.xyz.com";
var id;
downloadButton.parentNode.replaceChild(newElement, downloadButton)
function startDownload() {
this.style.display = 'none';
id = setInterval(function() {
counter--;
if (counter < 0) {
newElement.parentNode.replaceChild(downloadButton, newElement);
clearInterval(id);
} else {
newElement.innerHTML = counter.toString() " second.Please Wait";
}
}, 1000);
};
var clickbtn = document.getElementById("btn");
clickbtn.onclick = startDownload
</script>
</div>uj5u.com熱心網友回復：
第一： <script>標簽未在div元素內使用
第二：您可以使用額外的變數并檢查其狀態以運行該函式。
這里使用focusOut的值為 false，如果視窗最小化或失去焦點（打開其他選項卡），則值更改為 true，false如果重新獲得焦點，則更改回。此狀態用于保持功能運行。
var downloadButton = document.getElementById("download");
var counter = 45;
var newElement = document.createElement("p");
newElement.innerHTML = "www.xyz.com";
var id;
let focusOut = false;
downloadButton.parentNode.replaceChild(newElement, downloadButton)
function startDownload() {
this.style.display = 'none';
id = setInterval(function() {
if (!focusOut) {
counter--;
if (counter < 0) {
newElement.parentNode.replaceChild(downloadButton, newElement);
clearInterval(id);
} else {
newElement.innerHTML = counter.toString() " second.Please Wait";
}
}
}, 1000);
};
var clickbtn = document.getElementById("btn");
clickbtn.onclick = startDownload
window.addEventListener('blur', function() {
focusOut = true;
})
window.addEventListener('focus', function() {
focusOut = false;
});<div style="text-align: center;">
<a class="button" href="" id="download">Click To Download</a>
<button class="infoblogger" id="btn"> Download</button>
</div>
<script>
</script>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/365490.html
標籤：javascript html