javascript - 如何使用 Javascript 和/或 jQuery 从父窗口访问 iframe 文档事件鼠标位置

Question

我在父窗口中有一个 iframe，iframe src 和父窗口都位于同一个域中。为了使 iframe 文档中没有 Javascript，我希望能够在父窗口中使用一个函数来获取 iframe 内的鼠标位置。

到目前为止，我在这方面的尝试包括：

<iframe id="iframe1" src="test.html" style="position:relative; width:500px; height:500px"></iframe>
<div id="result" style="border:1px solid black"></div>

<script>
$(document).bind("mousemove", function(e){
    $("#result").html("x:" + e.pageX + ", y:" + e.pageY);
});
    
$("#iframe1").contents().find(document).bind("mousemove", function(e){
$("#result", window.parent.document).html("x:" + e.pageX + ", y:" + e.pageY);
});
</script>

第一个mousemove事件正常工作，在结果 div 中显示鼠标位置，但第二个事件（我试图绑定到 iframe 文档）没有响应。​</p>

Answer 1

这有效，除了权限部分。

JS：

$(document).bind("mousemove", function(e) {
    $("#result").html("x:" + e.pageX + ", y:" + e.pageY);
});

$($("#iframe1").contents()[0], window).bind("mousemove", function(e) {
    $("#result").html("x:" + (e.pageX) + ", y:" + e.pageY);
});

问题出在.find(). 我只是在内容返回的数组上使用了第一个索引，因为 iframe 应该只包含一个文档。

更新了一个更好的例子。