일정 기간 동안 페이지에 활동이없는 경우 웹 페이지를 자동으로 다시로드하려면 어떻게합니까?
답변
활동이없는 경우 페이지를 새로 고치려면 활동을 정의하는 방법을 알아야합니다. 누군가가 키를 누르거나 마우스를 움직이지 않는 한 매분마다 페이지를 새로 고칩니다. 이벤트 바인딩에 jQuery를 사용합니다.
<script>
var time = new Date().getTime();
$(document.body).bind("mousemove keypress", function(e) {
time = new Date().getTime();
});
function refresh() {
if(new Date().getTime() - time >= 60000)
window.location.reload(true);
else
setTimeout(refresh, 10000);
}
setTimeout(refresh, 10000);
</script>
답변
이 메타 태그를 사용하면 자바 스크립트없이 수행 할 수 있습니다.
<meta http-equiv="refresh" content="5" >
여기서 content = “5”는 페이지가 새로 고쳐질 때까지 기다리는 초입니다.
그러나 활동이없는 경우에만 어떤 종류의 활동을 하시겠습니까?
답변
jquery가 필요없는 완벽한 자바 스크립트 솔루션을 만들었습니다. 플러그인으로 바꿀 수 있습니다. 유동적 인 자동 새로 고침에 사용하지만 여기에 도움이 될 것 같습니다.
// Refresh Rate is how often you want to refresh the page
// bassed off the user inactivity.
var refresh_rate = 200; //<-- In seconds, change to your needs
var last_user_action = 0;
var has_focus = false;
var lost_focus_count = 0;
// If the user loses focus on the browser to many times
// we want to refresh anyway even if they are typing.
// This is so we don't get the browser locked into
// a state where the refresh never happens.
var focus_margin = 10;
// Reset the Timer on users last action
function reset() {
last_user_action = 0;
console.log("Reset");
}
function windowHasFocus() {
has_focus = true;
}
function windowLostFocus() {
has_focus = false;
lost_focus_count++;
console.log(lost_focus_count + " <~ Lost Focus");
}
// Count Down that executes ever second
setInterval(function () {
last_user_action++;
refreshCheck();
}, 1000);
// The code that checks if the window needs to reload
function refreshCheck() {
var focus = window.onfocus;
if ((last_user_action >= refresh_rate && !has_focus && document.readyState == "complete") || lost_focus_count > focus_margin) {
window.location.reload(); // If this is called no reset is needed
reset(); // We want to reset just to make sure the location reload is not called.
}
}
window.addEventListener("focus", windowHasFocus, false);
window.addEventListener("blur", windowLostFocus, false);
window.addEventListener("click", reset, false);
window.addEventListener("mousemove", reset, false);
window.addEventListener("keypress", reset, false);
window.addEventListener("scroll", reset, false);
document.addEventListener("touchMove", reset, false);
document.addEventListener("touchEnd", reset, false);
답변
<script type="text/javascript">
var timeout = setTimeout("location.reload(true);",600000);
function resetTimeout() {
clearTimeout(timeout);
timeout = setTimeout("location.reload(true);",600000);
}
</script>
resetTimeout ()이 호출되지 않으면 위의 10 분마다 페이지가 새로 고쳐집니다. 예를 들면 다음과 같습니다.
<a href="javascript:;" onclick="resetTimeout();">clicky</a>
답변
허용 된 arturnt의 답변을 기반으로합니다. 이것은 약간 최적화 된 버전이지만 본질적으로 동일한 기능을 수행합니다.
var time = new Date().getTime();
$(document.body).bind("mousemove keypress", function () {
time = new Date().getTime();
});
setInterval(function() {
if (new Date().getTime() - time >= 60000) {
window.location.reload(true);
}
}, 1000);
차이점은이 버전이 setInterval
대신에 setTimeout
코드를 사용 한다는 점입니다 .
답변
var bd = document.getElementsByTagName('body')[0];
var time = new Date().getTime();
bd.onmousemove = goLoad;
function goLoad() {
if(new Date().getTime() - time >= 1200000) {
time = new Date().getTime();
window.location.reload(true);
}else{
time = new Date().getTime();
}
}
마우스를 움직일 때마다 마우스를 마지막으로 움직일 때 확인합니다. 시간 간격이 20 분을 초과하면 페이지가 다시로드되고 마지막으로 이동 한 마우스는 갱신됩니다.
답변
선택한 대상으로 자동 새로 고침 이 경우 대상은 _self
자체 로 설정되지만 window.open('self.location', '_self');
코드를이 예제와 같이 간단히 변경하여 다시로드 페이지를 변경할 수 있습니다 window.top.location="window.open('http://www.YourPageAdress.com', '_self'";
.
확인 경고 메시지와 함께 :
<script language="JavaScript">
function set_interval() {
//the interval 'timer' is set as soon as the page loads
var timeoutMins = 1000 * 1 * 15; // 15 seconds
var timeout1Mins = 1000 * 1 * 13; // 13 seconds
itimer=setInterval("auto_logout()",timeoutMins);
atimer=setInterval("alert_idle()",timeout1Mins);
}
function reset_interval() {
var timeoutMins = 1000 * 1 * 15; // 15 seconds
var timeout1Mins = 1000 * 1 * 13; // 13 seconds
//resets the timer. The timer is reset on each of the below events:
// 1. mousemove 2. mouseclick 3. key press 4. scrolling
//first step: clear the existing timer
clearInterval(itimer);
clearInterval(atimer);
//second step: implement the timer again
itimer=setInterval("auto_logout()",timeoutMins);
atimer=setInterval("alert_idle()",timeout1Mins);
}
function alert_idle() {
var answer = confirm("Session About To Timeout\n\n You will be automatically logged out.\n Confirm to remain logged in.")
if (answer){
reset_interval();
}
else{
auto_logout();
}
}
function auto_logout() {
//this function will redirect the user to the logout script
window.open('self.location', '_self');
}
</script>
확인 알림이없는 경우 :
<script language="JavaScript">
function set_interval() {
//the interval 'timer' is set as soon as the page loads
var timeoutMins = 1000 * 1 * 15; // 15 seconds
var timeout1Mins = 1000 * 1 * 13; // 13 seconds
itimer=setInterval("auto_logout()",timeoutMins);
}
function reset_interval() {
var timeoutMins = 1000 * 1 * 15; // 15 seconds
var timeout1Mins = 1000 * 1 * 13; // 13 seconds
//resets the timer. The timer is reset on each of the below events:
// 1. mousemove 2. mouseclick 3. key press 4. scrolling
//first step: clear the existing timer
clearInterval(itimer);
clearInterval(atimer);
//second step: implement the timer again
itimer=setInterval("auto_logout()",timeoutMins);
}
function auto_logout() {
//this function will redirect the user to the logout script
window.open('self.location', '_self');
}
</script>
본문 코드는 두 솔루션 모두에서 동일합니다.
<body onLoad="set_interval(); document.form1.exp_dat.focus();" onKeyPress="reset_interval();" onmousemove="reset_interval();" onclick="reset_interval();" onscroll="reset_interval();">