jquery在IFRAME中查找鼠标点击位置答案

【问题标题】：jquery find the mouse click positions in IFRAMEjquery在IFRAME中查找鼠标点击位置
【发布时间】：2013-07-03 03:59:13
【问题描述】：

我在 IFRAME 中有一个内容，我需要在鼠标点击时找到上下坐标。

我正在使用以下代码查找顶部和左侧坐标，但顶部 (e.pageY) 坐标在 IFRAME 滚动时给出了错误的位置。

var iframeDoc = $('#bookcontentHeight').contents().get(0);
// Bind event to iframe document
$(iframeDoc).bind('mouseup', function(e) {                       
    e.preventDefault();                 
    $("#custom-menu").css({
        top: e.pageY + "px", left: e.pageX + "px" 
    }).show(100);
});

【问题讨论】：

标签： javascript jquery

【解决方案1】：

注意：- 代码在 JS 中

<head>
<script language="JavaScript">
function point_it(event){
    pos_x = event.offsetX?(event.offsetX):event.pageX-document.getElementById("pointer_div").offsetLeft;
    pos_y = event.offsetY?(event.offsetY):event.pageY-document.getElementById("pointer_div").offsetTop;
    document.getElementById("cross").style.left = (pos_x-1) ;
    document.getElementById("cross").style.top = (pos_y-15) ;
    document.getElementById("cross").style.visibility = "visible" ;
    document.pointform.form_x.value = pos_x;
    document.pointform.form_y.value = pos_y;
}
</script>
</head>
<body>
<form name="pointform" method="post">
<div id="pointer_div" onclick="point_it(event)" style = "background-image:url('sun.jpg');width:500px;height:333px;">
<img src="point.gif" id="cross" style="position:relative;visibility:hidden;z-index:2;"></div>
You pointed on x = <input type="text" name="form_x" size="4" /> - y = <input type="text" name="form_y" size="4" />
</form> 
</body>
</html>

这是工作在 jquery 中得到它的等价物。

【讨论】：