是，如果當前沒有顯示在頁面的JavaScript不是在移動設備上運行？

Question

我跟蹤用戶花在讀內容在我的網站的時間。要考慮用戶實際上正在閱讀，我在10秒鐘之後完成了第一次ajax請求，頁面已被加載。然後，我設置了beforeunload事件來觸發另一個Ajax請求通知用戶已經讀完。

當用戶在另一個選項卡中打開另一個頁面時出現問題，但我正在跟蹤的頁面未關閉，因此我在10分鐘後設置I計時器以觸發結束讀取ajax並取消設置beforeunload。這使瀏覽器在頁面打開時發送信號，但該選項卡尚未關閉。

不過，我已經注意到，在移動設備（Android設備，iPhone和iPad），定時器設置後10分鐘沒有得到執行自動發現讀完。所以，我想知道如果：做的時候，屏幕上沒有顯示的頁面，以節省電池的移動設備停止執行JavaScript？如果是這樣，我怎麼能運行計時器並引發Ajax請求，即使沒有顯示頁面（但仍處於打開狀態）？

function endReading(id) { 
    $.ajax({ 
    url: "{% url 'end_read_content' %}", 
    type: "post", 
    data: {"id": id}, 
    async: false, 
    }); 
} 
setTimeout(function() { 
    $.ajax({ 
    url: "{% url 'new_read_content' %}", 
    type: "post", 
    data: {"content_slug": "{{ content.slug }}"}, 
    success: function(data) { 
     $(window).on('beforeunload', function() {endReading(data)}); 
     setTimeout(function() { 
     endReading(data); 
     $(window).off('beforeunload'); 
     }, 600000); 
    } 
    }); 
}, 10000); 

Answer 1

相反的setTimeout的使用requestAnimationFrame

https://developer.mozilla.org/en-US/docs/Web/API/window.requestAnimationFrame

通過規範窗口時不聚焦此功能不會叫。

http://caniuse.com/requestanimationframe

更多細節在這裏：

http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/

它傳遞的當前運行時間爲int，所以你的函數應該檢查並只發送一個Ajax請求每隔多少秒。

爲響應「我可以用這個不是動畫」的問題：

當然，你可以用它爲任何你想要的。另一種選擇

var lastUsageTime = 0; 
var lastSentTime = 0; 

window.requestAnimationFrame(function(t){ 
lastUsageTime = t; 
}); 

setTimeout(function(){ 
if(lastUsageTime - lastSentTime > 10000){ 
//do ajax 
lastSentTime = lastUsageTime 
} 
});