在X + Y時間後X時間不活動並註銷後顯示警告javascript

Question

我見過很多類似於此問題的答案。沒有人幫我解決了這個問題。 問題 - 我想在閒置5分鐘後顯示警告消息，如果用戶在警告5分鐘後仍然不活動，則頁面應自動重定向到logoff.jsp。 我不想在這裏使用Jquery，它只能用Javascript來完成。 幫助!!

var IDLE_TIMEOUT = 15; //seconds 
var _idleSecondsCounter = 0; 

document.onkeypress = function() 
{ 
    _idleSecondsCounter = 0; 
}; 
document.onclick = function() 
{ 
    _idleSecondsCounter = 0; 
}; 
document.onmousemove = function() 
{ 
    _idleSecondsCounter = 0; 
}; 

window.setInterval(CheckIdleTime, 1000); 

function CheckIdleTime() { 
    _idleSecondsCounter++; 
    var oPanel = document.getElementById("SecondsUntilExpire"); 
    if (oPanel) 
     oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + ""; 
    if (_idleSecondsCounter >= IDLE_TIMEOUT) { 
     var answer = confirm("It's been long time you are idle.\nPlease click OK to continue session.\nTo close this session click Cancel."); 
     if (answer) 
     { 
      //document.location.href = "logout.html"; 
      _idleSecondsCounter=0; 
     } 
     else{ 
      //window.open('', '_self', ''); window.close(); 
      document.location.href = "logoff.jsp"; 
     } 

    } 
} 

Answer 1

啊，你不能以編程方式關閉alert()或confirm()或這些模態。如果你想這樣做，你必須製作自己的盒子。

當您顯示confirm()時，您的JS執行會自動暫停。所以你需要使用HTML/CSS創建自定義對話框。

function tempAlert(msg,duration) 
{ 
    var el = document.createElement("div"); 
    el.setAttribute("style","position:absolute;top:40%;left:20%;background-color:white;"); 
    el.innerHTML = msg; 
    setTimeout(function(){ 
     el.parentNode.removeChild(el); 
     // 5 minutes over. sign off user 
    },duration); 
    document.body.appendChild(el); 
} 

tempAlert("We're signing you off in 5 minutes",5*60000);