用戶閒置後彈出

我已經編寫了一些代碼，可以爲用戶提供一條消息，讓他們忽略該消息，或者如果他們閒置超過一分鐘，則轉到其他頁面。一切正常，除非用戶忽略消息。這裏是我的代碼：用戶閒置後彈出

if (valid) { 
    var idleTime = 0; 
    jQuery(document).ready(function() { 
    var idleInterval = setInterval(timerIncrement, 60000); 
}); 

function resetTimer() { 
    idleTime = 0; 
} 

jQuery(document) 
.on('mousemove', resetTimer) 
.on('keydown', resetTimer) 
.on('scroll', resetTimer); 

function timerIncrement() { 
    idleTime = idleTime + 1; 
    if (idleTime >= 1) { 
     jQuery('#popup').show(); 
    } 
    jQuery(window).unbind(); 
} 

jQuery('#popupClose').click(function() { 
    jQuery('#popup').hide(); 
}); 
}

我希望彈出窗口在他們單擊#popupClose後不重新填充。

來源

2017-10-10 kemosabe

你只是問在用戶點擊那個元素時如何使用'clearInterval（）'？ – David

工作小提琴/ plunkr會很好 – Pavan

clearInterval（idleInterval）;這將刪除間隔，所以它不會再發生 – schylake

您既可以將信息存儲在cookie中，也可以將信息存儲在標記中（具體取決於您希望在每個綜合瀏覽量中是否顯示彈出窗口或僅顯示一次時間段）。

然後，在顯示彈出窗口之前檢查標記/ cookie。例如：

function timerIncrement() { 
    idleTime = idleTime + 1; 
    if (idleTime >= 1) { 
     if (jQuery('#popup').data('closed') == 1){ 
      jQuery('#popup').show(); 
     } 
    } 
    jQuery(window).unbind(); 
} 

jQuery('#popupClose').click(function() { 
    jQuery('#popup').data('closed', 1); 
    jQuery('#popup').hide(); 
});

來源

2017-10-10 18:10:38

我會這樣做。只需在初始化腳本時定義一個開始時間。讓間隔運行來檢查已經過了多少時間。如果它比你的時間更希望展示對話。如果不隱藏它。還要重置事件上的計時器。您的JavaScript看起來像這樣

$('#btclose').on('click', function(){ 
    clearInterval(interv); 
    $('#popup').hide(); 
}); 
var start = new Date(); 

var interv = setInterval(function(){ 
    var now = new Date(); 
    console.log() 
    if(now-start > 5*1000){ 
    $('#popup').show(); 
    } 

},10); 


$('body').on('mousedown click mousemove', function(){ 
    start = new Date(); 
});

這裏是我的小提琴

https://jsfiddle.net/c2L7wpn3/8/

似乎工作。讓我知道這是否有幫助

來源

2017-10-10 18:30:09 Chris

用戶閒置後彈出

回答

相關問題