-1

如果空闲超过 1 分钟,我的文件中有以下Javascript代码php被调用以刷新页面。qc.php这是完美的工作。

//If idling for 1 minutes, page will refresh

var IDLE_TIMEOUT = 60; //in seconds. So every 1 minutes idling, page will refresh
var _idleSecondsTimer = null;
var _idleSecondsCounter = 0;

document.onclick = function() {
  _idleSecondsCounter = 0;
};

document.onmousemove = function() {
  _idleSecondsCounter = 0;
};

document.onkeypress = function() {
  _idleSecondsCounter = 0;
};

_idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);

function CheckIdleTime() {
  _idleSecondsCounter++;
  var oPanel = document.getElementById("SecondsUntilExpire");
  if (oPanel)
    oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
  if (_idleSecondsCounter >= IDLE_TIMEOUT) {
    window.clearInterval(_idleSecondsTimer);
    document.location.href = "qc.php";
  }
}

设想

我想在许多其他页面中进行此刷新,因此决定将其作为单独javascript文件中的函数。因此,我创建了一个如下函数并保存在另一个名为func.js

function idlingTrigger(page) {
  //If idling for 1 minutes, page will refresh

  var IDLE_TIMEOUT = 60; //in seconds. So every 1 minutes idling, page will refresh
  var _idleSecondsTimer = null;
  var _idleSecondsCounter = 0;

  document.onclick = function() {
    _idleSecondsCounter = 0;
  };

  document.onmousemove = function() {
    _idleSecondsCounter = 0;
  };

  document.onkeypress = function() {
    _idleSecondsCounter = 0;
  };

  _idleSecondsTimer = window.setInterval(CheckIdleTime(page), 1000);

}

function CheckIdleTime(page) {
  _idleSecondsCounter++;
  var oPanel = document.getElementById("SecondsUntilExpire");
  if (oPanel)
    oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
  if (_idleSecondsCounter >= IDLE_TIMEOUT) {
    window.clearInterval(_idleSecondsTimer);
    document.location.href = page;
  }
}

然后我将func.js文件包含在我的qc.php文件中,如下所示

<script src="func.js"></script>

问题

当我尝试qc.php如下调用该函数时,

idlingTrigger("qc.php");

Uncaught ReferenceError在我的控制台里

有谁知道这里有什么问题?

编辑 1

意识到我没有在函数之间传递参数。所以我编辑了我的函数如下。还通过删除更改了所有私有变量_

function idlingTrigger(page) {
  //If idling for 10 minutes, page will refresh

  var IDLE_TIMEOUT = 60; //in seconds. So every 10 minutes idling, page will refresh
  var idleSecondsTimer = null;
  var idleSecondsCounter = 0;

  document.onclick = function() {
    idleSecondsCounter = 0;
  };

  document.onmousemove = function() {
    idleSecondsCounter = 0;
  };

  document.onkeypress = function() {
    idleSecondsCounter = 0;
  };

  idleSecondsTimer = window.setInterval(CheckIdleTime(page, idleSecondsCounter, IDLE_TIMEOUT), 1000);

}

function CheckIdleTime(page, idleSecondsCounter, IDLE_TIMEOUT) {
  idleSecondsCounter++;
  var oPanel = document.getElementById("SecondsUntilExpire");
  if (oPanel)
    oPanel.innerHTML = (IDLE_TIMEOUT - idleSecondsCounter) + "";
  if (idleSecondsCounter >= IDLE_TIMEOUT) {
    window.clearInterval(idleSecondsTimer);
    document.location.href = page;
  }
}

现在控制台错误消失了。但是页面似乎并不令人耳目一新。有人知道吗?

编辑 2

func.js我通过以下方式更改了文件,它令人耳目一新。但是这样页面名称仍然是静态的,这不是我需要的。

//If idling for 1 minutes, page will refresh
var idleSecondsTimer = null;
var IDLE_TIMEOUT = 60; //in seconds. So every 1 minutes idling, page will refresh
var idleSecondsCounter = 0;

function idlingTrigger() {


  document.onclick = function() {
    idleSecondsCounter = 0;
  };

  document.onmousemove = function() {
    idleSecondsCounter = 0;
  };

  document.onkeypress = function() {
    idleSecondsCounter = 0;
  };

  idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);
}

function CheckIdleTime() {
  idleSecondsCounter++;
  var oPanel = document.getElementById("SecondsUntilExpire");
  if (oPanel)
    oPanel.innerHTML = (IDLE_TIMEOUT - idleSecondsCounter) + "";
  if (idleSecondsCounter >= IDLE_TIMEOUT) {
    window.clearInterval(idleSecondsTimer);
    document.location.href = "qc.php";
  }
}

所以我注意到的是,当我给函数一些参数时CheckIdleTime,整个事情不再令人耳目一新了。任何人都知道如何使页面名称动态化,以便我可以将整个代码用作我使用的任何页面的通用功能?

4

1 回答 1

0

我通过以下方式对其进行了修改。如您所见,我没有将任何参数传递给,而是在文件中CheckIdleTime使用全局变量。然后在函数内部使用该全局变量。pageqc.phppageCheckIdleTime

func.js 文件的内容

//If idling for 1 minutes, page will refresh
var idleSecondsTimer = null;
var IDLE_TIMEOUT = 60; //in seconds. So every 1 minutes idling, page will refresh
var idleSecondsCounter = 0;

function idlingTrigger() {

  document.onclick = function() {
    idleSecondsCounter = 0;
  };

  document.onmousemove = function() {
    idleSecondsCounter = 0;
  };

  document.onkeypress = function() {
    idleSecondsCounter = 0;
  };

  idleSecondsTimer = window.setInterval(CheckIdleTime, 1000);
}

function CheckIdleTime() {

  idleSecondsCounter++;
  var oPanel = document.getElementById("SecondsUntilExpire");
  if (oPanel)
    oPanel.innerHTML = (IDLE_TIMEOUT - idleSecondsCounter) + "";
  if (idleSecondsCounter >= IDLE_TIMEOUT) {
    window.clearInterval(idleSecondsTimer);
    document.location.href = page;
  }
}

然后在中qc.php,添加以下代码

<script src="func.js"></script>  
var page = "qc.php"; //Pass any page name you want here and save it in the variable called `page`
idlingTrigger();

可能有一种简单或优雅的方式。如果有人有更好的方法,请告诉我如何。无论如何,上述方法有效

于 2021-01-14T06:57:22.763 回答