如何使用javascript和/或jquery从父窗口访问iframes文档事件鼠标位置

时间:2012-10-14 16:32:03

标签: javascript jquery iframe javascript-events mousemove

我在父窗口中有一个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文档)没有响应。

1 个答案:

答案 0 :(得分:3)

This有效,但权限部分除外。

<强> 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应该只包含文档。

更新了一个更好的例子。