jQuery Mobile、バックボーン、および通常の ole javascript タイマーを使用して、snafoo に遭遇しました。Web アプリには、2 つの連続するページで実行されるアイドル タイマーがあります。問題は、私が現在イベントを処理している方法 (pageshow ですべてをラップしている) であり、私のテストでは、後続の pageshow イベントでインスタンス化された 2 番目のタイマーに加えて、最初のページのタイマーが引き続き実行されていることがわかります。セッション カウントダウン (countdown 変数の 2 つのインスタンスが同時に表示されます)。
が既に存在するかどうかを確認しようとidleIntervalしましたが、役に立ちませんでした（結果は常に存在しないという結果でした）。
他の「pagechange」イベントの 1 つをリッスンできると思います-開始時にトリガーされ、前のタイマーを停止するイベントなど-ただし、コードのさまざまな部分をさまざまな「pagechange」イベント内にラップする必要があるため、範囲の問題 (いずれの場合も同じバックボーン モデルを参照する必要があります)。なんて混乱...
$(document).on('pageinit pageshow', 'div:jqmData(role="page"), div:jqmData(role="dialog")', function (event) {
if($(this).attr("id")!="KioskDefaultLogin" && $(this).hasClass('kiosk-mode') && event.type=='pageshow') {
...backbone js code...
function sessionTimeout() {
var inactivetime = 0;
console.log('TIMER EXISTS?=>'+window.hasOwnProperty('idleInterval'));
if( qnumerItem.get("state") != "login") {
var idleInterval = setInterval(function(){
if(qnumerItem.get("state") != "timeout") {
inactivetime ++;
console.log('TIMER -----'+inactivetime+'------');
}
////console.log("timer 1: "+inactivetime);
/*Edit the inactivetime value here to change the idle session timer*/
if (inactivetime == 15 && qnumerItem.get("state") != "timeout") {
qnumerItem.changeState("timeout");
inactivetime=0;
/*End Session Due to Inactivity Countdown*/
$(function(){
var count=30;
console.log("I STARTED");
var countdown = setInterval(function(){
//$(".ui-page-active .session-countdown").html(count);
//$(".ui-page-active .to-phrase").show();
if (count == 0) {
clearInterval(countdown);
qnumerItem.changeState("kill");
}
count--;
console.log("timer 1: "+inactivetime);
console.log("timer 2: "+count);
}, 1000);
$(this).on( 'click', '.to-continue', function(event) {
event.preventDefault();
clearInterval(countdown);
$("#session-countdown").html(60);
});
$(this).on( 'click', '.to-end', function(event) {
event.preventDefault();
clearInterval(countdown);
});
});
}
}, 1000); // 1 second
}
//Zero the idle timer on mouse movement.
document.addEventListener('touchstart', function(e) {
e.preventDefault();
inactivetime = 0;
}, false);
document.addEventListener('touchmove',
function (e) {
e.preventDefault();
}, false);
$(this).mousemove(function (e) {
inactivetime = 0;
});
$(this).keypress(function (e) {
inactivetime = 0;
});
$(this).click(function (e) {
inactivetime = 0;
});
}
sessionTimeout();
...more code....