使用javascript检测触摸设备上的不活动状态

Question

I've been researching and found code that detects inactivity(when the user doesn't touch the screen) after the user goes idle for x amount of time which works perfectly when using the mouse but when I try using this with touch screen devices, it doesn't detect my finger or work. I've added a lot of DOM events such as " touchstart ", " touchmove ", " touchend ", " touchcancel " and others but they don't seem to work either. Here is my code

var idleTime = 0;
    $(document).ready(function () {
      //Increment the idle time counter every minute.
      var idleInterval = setInterval(timerIncrement, 3000); 

      //Zero the idle timer on mouse movement.
      $(this).mousemove(function (e) {
        idleTime = 0;
      });
      $(this).keypress(function (e) {
        idleTime = 0;
      });
    });

    function timerIncrement() {
      idleTime = idleTime + 1;
      if (idleTime > 1) { 
        alert("ok");
      }
    }

Answer 1

I will adjust the timer (you sayd you want an update every minute but you set you setInterval to 3000 millisec and i will try with this:

var idleTime = 0;
$(document).ready(function () {
  //Increment the idle time counter every minute.
  var idleInterval = setInterval(timerIncrement, 60000); 

  //Zero the idle timer on mouse movement.
  $(this).mousemove(function (e) {
    idleTime = 0;
  });
  $(this).keypress(function (e) {
    idleTime = 0;
  });
  //Zero the idle timer on touch events.
  $(this).bind('touchstart', function(){
   idleTime = 0;
  });
  $(this).bind('touchmove', function(){
   idleTime = 0;
  });
});

function timerIncrement() {
  idleTime = idleTime + 1;
  if (idleTime > 1) { 
    alert("ok");
  }
}

Answer 2

尝试添加以下代码：

$(this).bind('touchstart touchmove click', function(){ idleTime = 0; }