2017-02-23 55 views
3

我想使用webworker來檢測我的空閒時間。如何在javascript/jquery中使用webworker來檢測空閒時間?

我在寫一些代碼。我還需要添加什麼才能讓我的計數器在鼠標移動或按鍵上重新啓動?

我是新來的編碼。請幫忙。這裏是我的代碼:

<ul id="message-list"></ul> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script type="text/javascript"> 
    var worker = new Worker('demo.js'); 
    worker.onmessage = function(e){ 
    var message =e.data; 
    $('#message-list').append('<li>'+message+'</li>'); 
    } 
</script> 

這是我的主HTML文件和demo.js低於:

var idleTime = 0; 
var idleInterval = setInterval(timerIncrement, 1000); 
function timerIncrement() { 
idleTime = idleTime + 1; 
self.postMessage(idleTime); 
    if (idleTime == 15) { // 15 seconds 
     self.close(); 
    } 
} 

在這段代碼迴路將15秒運行,那麼工人將終止。我想要的是,如果我移動鼠標或按下鍵盤上的任何鍵,此循環將再次從0開始。

$(document).keypress(function(e){ 

       worker.postMessage({ 
       type: 'KEYPRESS', 
       keycode: e.which 
      }); 
    }); 

而在你woker聽:

+0

是否有任何特定的原因,你決定使用這個工人?這似乎是在主線程中運行得很好的東西? – adeneo

+0

@adeneo還有一些其他的東西,我將添加在這個demo.js,我想如果有一種方法,我可以在工作人員內使用這個js – Frank

+0

@adeneo我從來沒有使用過工人,因此我想問我們可以有多個postmessage和onmessage ...就像一個postmessage發送一些不同的對象,另一個postmessage發送不同的對象,通過主頁中的onmessage讀取? – Frank

回答

1

由於網絡工作者沒有訪問DOM,你可以從你的主線程當一個鍵按下時或鼠標移動發佈消息你的工人消息:

self.onmessage = function(msg) { 
    switch (msg.data.type) { 
    case 'KEYPRESS': 
    console.log("Key pressed"); 
    idleTime = 0; 
    break; 
    }}