Ich habe einen einfachen Timer-Dienst erstellt. Im Timer-Dienst überwache ich den Benutzer für jede Minute.Warum clearInterval den setInterval-Timer nicht löscht
Während des Ladens der Seite haben Sie 3 Minuten eingestellt, um eine Abmeldung zu erhalten und vor 1 Minute 2 Minuten, um eine Bootstrap-Warnung zu erhalten. Klicken Sie auf die Schaltfläche Fortfahren, um die aktuellen Intervalle zu löschen und erneut 3 Minuten zu vergeben , erhalten Sie eine Warnmeldung zum Abmelden nach 3 Minuten.
Zum ersten Mal funktioniert es gut, beim Klicken auf die Schaltfläche fortfahren, ist es nicht den Wert für den Benutzer neu zuweisen. Für die 3. Minute selbst, zeigt es die Abmeldung.
Wo ist falsch in der Art von Code.
<!DOCTYPE html>
<html>
<head>
<link data-require="[email protected]" data-semver="4.0.0-alpha.4" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.4/css/bootstrap.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js" ></script>
<script data-require="[email protected]" data-semver="3.3.6" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body onload="TimerService()">
<p id="demo"></p>
<h1 id="title">Javascript timer problem</h1>
<div id="modeldialog"></div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<label class="session-expiration">
<span>Session Expiration</span>
<img src="~/Images/Warning_Alert_Icon_26.png" />
</label>
</div>
<div class="modal-body">
<div class="session-message">
<p class="time-message">your Session will expire in <i id="timer" class="fa fa-clock-o">
<span class="expire">Minutes </span>
</i>
.click proceed to stay Login.</p>
<p class="time-message">
<b>Click Proceed to stay Login.</b>
</p>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" onclick="LogOut()">Logout</button>
<button type="button" class="btn btn-primary" onclick="proceed()">Proceed</button>
</div>
</div>
</div>
</div>
</body>
</html>
javascript:
function proceed()
{
$("#myModal").toggle();
TimerService();
}
function load(){
alert(" if click proceed , timer service extended another 3 minutes else logout after 3 ");
$("#myModal").modal();
}
function TimerService()
{
alert("TimerService");
var timer = false;
clearInterval(timer);
if (timer == false) {
var lastDigestRun = new Date();
lastDigestRun = Date.now();
var s = lastDigestRun + 3 * 60 * 1000;
// for reference
document.getElementById("demo").innerHTML = new Date(s);
console.info("Your logout time +" + new Date(s));
timer=setInterval(function() {
var now = Date.now();
var displaytime = now - lastDigestRun > 2 * 60 * 1000;
if (now - lastDigestRun > 2 * 60 * 1000) {
load();
}
if (now - lastDigestRun > 3 * 60 * 1000) {
alert("logout");
}
}, 60 * 1000);
}
}
Plunker Demo:
https://plnkr.co/edit/qwNJF648LIvUUNT3IMkc?p=preview
Sie löschen vor dem Erstellen von 'setInterval()' –
'ClearInterval' löscht nur' setInterval' Timer nicht 'setTimeout' Einsen. – Bergi
@Jyothi Babu Araja dann, wo ich muss, weil zum ersten Mal, müssen Sie den Timer auf laden, nach dem Klick fortzufahren, müssen erneut den Timer neu zuweisen –