=波波日志 > JavaScript/Ajax > 获取iframe中鼠标事件在父页的坐标位置=

获取iframe中鼠标事件在父页的坐标位置

  如果在iframe中单击鼠标时,使用event.clientX和event.clientY获取到的是点击的位置相对于iframe的坐标位置,并非是相对于父页的,所以如果要获取相对于父页的坐标位置,就需要加上iframe的绝对位置x和y,这样才是相对于父页的坐标位置。

  换算关系:相对坐标xiframe绝对x位置+iframe内触发的鼠标x位置

  注意事项:由于要使用到父页的数据,所以不能跨顶级域名,只能跨2级域名

  代码如下
test.htm

+展开
-HTML
<iframe src="b.htm" width="300" height="300" id="ifr"></iframe>
<script type="text/javascript">
var ifX=false,ifY=false;//iframe的绝对位置
window.onload=function(){
  var ifr=document.getElementById('ifr');
  ifX=ifr.offsetLeft;
  ifY=ifr.offsetTop;
  while(ifr=ifr.offsetParent){
    ifX+=ifr.offsetLeft;
    ifY+=ifr.offsetTop;
  }
}
</script> 


b.htm
+展开
-HTML
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置<br>
获取iframe中鼠标事件在父页的坐标位置
<script type="text/javascript">
document.onclick=function(e){
  if(parent.ifX===false){alert('父页未初始化完毕,请稍后!');return false;}//判断父页是否初始化了iframe的绝对位置
  e=e||event;
  alert('x:'+(e.clientX+parent.ifX)//当前的位置加上iframe在父页的绝对位置就是相对父页的坐标了
    +'\ny:'+(e.clientY+parent.ifY))
}
</script> 
类别:JavaScript/Ajax 作者:波波 日期:2010-07-14 【评论:0】 
 
暂时没有评论!
发表留言
  • *昵称:
  • 头像:
  • 电子邮件: [留下您的邮件,方便管理员回复您。]
  • 个人网站: *验证码:
声明:本网站尊重并保护知识产权,根据《信息网络传播权保护条例》,如果我们转载或引用的作品侵犯了您的权利,请通知我们,我们会及时删除!
Powered by showbo,©2012WEB编程网桂ICP备05005887号 京公网安备1101055090