检查网址并重定向，如果不活动

Question

我一直在研究一个脚本，如果用户已经有一段时间不准备，那么会将页面重定向到一个url（对于我放了5秒的测试）。我错过了一些东西，因为即使用户处于活动状态，脚本也会重定向...你能指出我的代码中有什么问题吗？该函数将检查iframe url是否包含某个字符串，如果是，它将触发redirecturl函数。

var timeoutID;

function setup() {
    this.addEventListener("mousemove", resetTimer, false);
    this.addEventListener("mousedown", resetTimer, false);
    this.addEventListener("keypress", resetTimer, false);
    this.addEventListener("DOMMouseScroll", resetTimer, false);
    this.addEventListener("mousewheel", resetTimer, false);
    this.addEventListener("touchmove", resetTimer, false);
    this.addEventListener("MSPointerMove", resetTimer, false);

    startTimer();
}
setup();

function startTimer() {
    timeoutID = window.setTimeout(goInactive, 5000);
}

function resetTimer(e) {
    window.clearTimeout(timeoutID);
    goActive();
}

function redirecturl() {
     window.location.replace("http://google.com");
}

function goInactive() {
  // Check if the iframe url contains KDMPK 
  var srcurl = document.getElementById("nookalbooking").src;
  var n = srcurl.includes("KDMPK");

    if(n==true) {
      redirecturl();
    }
     //else
     //{
     // goActive();
     //           
     //}
}

function goActive() { 
    startTimer();
}

Answer 1

您应该将您的事件监听器添加到document：

function setup() {
    document.addEventListener("mousemove", resetTimer, false);
    document.addEventListener("mousedown", resetTimer, false);
    document.addEventListener("keypress", resetTimer, false);
    document.addEventListener("DOMMouseScroll", resetTimer, false);
    document.addEventListener("mousewheel", resetTimer, false);
    document.addEventListener("touchmove", resetTimer, false);
    document.addEventListener("MSPointerMove", resetTimer, false);

    startTimer();
}

Answer 2

非常感谢大家，事实证明我遇到了跨域安全问题，因为我的目标是iframe，所以我没想到。我已经更新了脚本并以某种方式克服了跨域安全问题，我认为这是新版本。一旦在iframe上记录了活动，计时器就会开始计时，然后在7分钟之后页面将刷新并返回主页 - 即使用户仍处于活动状态，这很烦人。我不能让重置计时器工作，任何想法？

<div class="iframe">
<iframe id="nookalbooking" src="https://bookings.nookal.com/bookings" width="100%" height="1950" allowtransparency="true" style=" border:0px solid #CCCCCC; border-radius: 3px;"></iframe>
  </div>
</div>

<script>
    var timeoutID;
    var myConfObj = {
  iframeMouseOver : false
};

function startTimer() {
    // wait 2 seconds before calling goInactive
    timeoutID = window.setTimeout(goInactive, 70000);
}
function goInactive() {
    location.reload();

}
function goActive() {
    // do something 
    startTimer();
}
function resetTimer(e) {
   window.clearTimeout(timeoutID);
   goActive();
}

window.addEventListener('blur',function(){
  if(myConfObj.iframeMouseOver){
  resetTimer();
  }
  else {
    goInactive();

  }
});

document.getElementById('nookalbooking').addEventListener('mouseover',function(){
   myConfObj.iframeMouseOver = true;

});

document.getElementById('nookalbooking').addEventListener('touchmove',function(){
   myConfObj.iframeMouseOver = true; 
});

document.getElementById('nookalbooking').addEventListener('MSPointerMove',function(){
   myConfObj.iframeMouseOver = true; 
});

document.getElementById('nookalbooking').addEventListener('mouseout',function(){
    myConfObj.iframeMouseOver = false;

});

</script>