iframe vs. Mousemovement - 或者：父子冲突

Question

首先我的项目有非常严格的限制：

• 离线可用性
• 尽可能简单的编码

=> PHP 和其他语言不是一个选项 - 只有 html 和 javascript。

---

结构：

• index.html
• frame.html

---

index.html 包含：

• 一个简单的 iframe：

• 用于禁用鼠标右键单击的 JavaScript：

• 另一个用于检测用户何时不活动的 JavaScript：

var timeoutID;函数设置（）{
this.addEventListener("mousemove", resetTimer, false);
this.addEventListener("mousedown", resetTimer, false);
this.addEventListener("keypress", resetTimer, false);
this.addEventListener("DOMMouseScroll", resetTimer, false);
this.addEventListener("鼠标滚轮", resetTimer, false);
this.addEventListener("touchmove", resetTimer, false);
this.addEventListener("MSPointerMove", resetTimer, false);>
开始定时器（）； } 设置（）;函数 startTimer() {
// 在调用 goInactive
之前等待 X 秒 timeoutID = window.setTimeout(goInactive, 3000); } 函数 resetTimer(e) {
window.clearTimeout(timeoutID);
去活动（）； } 函数 goInactive() {
// 做点什么
警报（“超时”）；
返回假； } 函数 goActive() {
// 做点什么
开始定时器（）； }

• css 文件还包含一些对鼠标光标的限制：

身体{
背景颜色：#f0f0f0；
光标：无！重要；
-webkit 用户选择：无；
-moz 用户选择：无；
-ms 用户选择：无；用户选择：无；
}

=> 这对于 index.html 非常有效 - 但不适用于 iframe（目前是同一目录中的本地文件，但它也应该能够链接到网站上）。

我尝试了几种解决方法，但没有一种方法能够在 iframe 中保持网站活动（这样您也可以浏览 frame.html 的内容）。

我对任何解决方案持开放态度 - 如果它将脚本交给孩子，或者孩子从父母或任何覆盖解决方案那里获得脚本。 如果 iframe 在同一目录中的脱机文件上重定向有解决方法 - 这在第一时间会很好。

非常感谢您！

---

编辑：

这仍然有问题 - 它涉及到一个永无止境的循环：

$('iframe').load(function(){
  $(this).contents().find("body").mousemove(function(){
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 = (this).setTimeout(goInactive, 4000);
}

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

function goInactive() {
     alert("TIMEOUT");
     return false;
     goactive;
}

function goActive() {         
    startTimer();
}
    });
});
$('iframe').attr("src","JavaScript:'iframe content'");

Answer 1

我已经用 jQuery 做到了这一点。 Link.

问题是当您的 iframe.html 不在您的域中时，您无法跨域执行此操作。