javascript - 在 Iframe 中跟踪鼠标移动的问题

Question

详细信息:-

在我们的项目中，我们需要实现一个功能，如果用户在 5 分钟内不活动，则需要注销该用户。如果用户 5 分钟没有移动鼠标，我们需要将其视为不活动。

我们能够在所有普通页面中实现这一点，但在一个页面中实现这一点会遇到困难，因为页面中有一个 iframe，并且 iframe 播放视频和其他 swf、mp4 文件。同样在 iframe 内部，还有另一个框架充当内容的包装器。

在上面的页面中，我们无法跟踪鼠标移动，因此无法检测用户是否处于事件状态。

经过大量研究，我们已经实现了代码，如果我们通过浏览器控制台运行，该代码可以正常工作，但当我将其保留在页面上时，该代码就不起作用。

有人研究过类似的功能或了解与此相关的任何信息吗？如果有人可以帮助我实现此功能，那就太好了。

Note :- Also there are click in Iframes

Answer 1

从技术上讲，iframe 的源是它自己的文档(documentception？)。诀窍是监听该文档内的鼠标事件。虽然我不知道，如果同源政策允许的话，你总是可以尝试一下。

使用普通 JS:

var iframeDocument = document.querySelector('iframe').contentDocument;

iframeDocument.addEventListener('mousemove', function (event) {
    console.log(event.pageX, event.pageY);
});

使用 jQuery:

$('iframe').contents().mousemove(function(e) {
    console.log(e.pageX, e.pageY);
});

您可以更进一步，将 iframe 文档内发生的所有事件分派(dispatch)到父文档。这使您能够仅对所有事件使用一个监听器，无论它们来自 <iframe> 内部。或不。