多级iframe中，获取元素相对于浏览器左上角的坐标（非当前frame）
搜索了好多文章，都不是自己想要的，所以在此贴下自己的解决方案，做个笔记。
1、常规需求：获取当前元素距离左边、顶部的距离
1 var x = $(div).offset().left;
2 var y = $(div).offset().top;
2、当元素处于iframe中时候，上面的方法获取的将是相对于iframe的的距离
此时我的做法是判断当前容器是不是iframe，如果是，则递归查找父级容器。累加每级容器计算的值即可
1 function GetPointInScreen(e, x, y) {
2 var point = e.getBoundingClientRect();
3 x += point.left;
4 y += point.top;
5 if (self != top) {
6 return window.parent.GetPointInScreen(window.parent.$("[name='myIframe']")[0], x, y);
7 }
8 return { x: x, y: y };
9 }
e：要获取坐标值的元素
myIframe：我自己的iframe的name值
3、demo
1 <body>
2 <div style="width:100%;height:100px"></div>
3 <iframe src="xxx">
4 <div style="width:100%;height:100px"></div>
5 <div style="width:100%;height:100px" onclick="test(this)"></div>
6 <script>
7 function test(e){
8 var point=GetPointInScreen(e,0,0);
9 console.log(point);
10 }
11 </script>
12 </iframe>
13 </body>
多级iframe中，获取元素相对于浏览器左上角的坐标（非当前frame）的更多相关文章
- Js/Jquery获取iframe中的元素
转载: Js/Jquery获取iframe中的元素 - - ITeye技术网站http://java-my-life.iteye.com/blog/1275205 在web开发中,经常会用到ifram ...
- js 获取iframe中的元素
今天要修改编辑器插件中的元素遇到的问题 jquery 在父窗口中获取iframe中的元素 1.Js代码 格式:$("#iframe的ID").contents().find(&qu ...
- 获取iframe中的元素
父窗口中获取iframe中的元素 var ifr = document.getElementById('suggustion').contentWindow.document.body; 在ifram ...
- Js/Jquery获取iframe中的元素 在Iframe中获取父窗体的元素方法
在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素.或者在iframe框架中使用父窗口的元素 js 在父窗口中获取iframe中的元素 1. 格式:window ...
- 关于如何获取iframe中的元素
今天研究了一下iframe中元素的获取,发现有些地方还是有点坑的. 首先:如果使用纯前端手段,是没有办法获取非同源的iframe中的元素的,后面会提到后端手段 一.同源环境 1.首先在父页面获取ifr ...
- 【学习】如何用jQuery获取iframe中的元素
(我的博客网站中的原文:http://www.xiaoxianworld.com/archives/292,欢迎遇到的小伙伴常来瞅瞅,给点评论和建议,有错误和不足,也请指出.) 说实在的,以前真的很少 ...
- 父窗口中获取iframe中的元素
js 在父窗口中获取iframe中的元素 1. 格式:window.frames["iframe的name值"].document.getElementById("ifr ...
- 在iframe窗体内 获取父级的元素；；在父窗口中获取iframe中的元素
在iframe中获取父窗口的元素 $(‘#父窗口中的元素ID’, parent.document).click(); 在父窗口中获取iframe中的元素 $(“#iframe的ID”).content ...
- js获取iframe中的元素以及在iframe中获取父级的元素（包括iframe中不存在name和id的情况）
第一种情况:iframe中不存在name和id的方法:(通过contentWindow获取) var iframe = document.getElementsByTagName('iframe' ...
随机推荐
- ORA-00018: maximum number of sessions exceeded 超出最大会话数
ORA-00018: maximum number of sessions exceededORA-00018: 超出最大会话数 Cause: All session state obje ...
- javascript 数据类型判断总结
一 typeof 回顾:js有五种基本数据类型:值类型("number","string","boolean","undefine ...
- 关于android和Linux的一些问题
1.Android为什么选择java? 由于java虚拟机,实现软件层的编程与硬件无关性(无需进行特定编译或平台配置). 2.Android和Linux内核区别? Android上的应用软件运行在da ...
- C++ 构造函数、拷贝构造函数、赋值运算符
<C++ Primer Plus> 12.1 动态内存和类 12.1.1 复习示例和静态类成员 不能在类声明中初始化静态成员变量,这是因为声明描述了如何分配内存,但并不分配内存 如果在头文 ...
- charles详解
Charles抓包https:https://www.jianshu.com/p/ec0a38d9a8cf 浅谈charles抓取https原理:https://www.jianshu.com/p/4 ...
- MySQL锁详细讲解
本文章向大家介绍MySQL锁详细讲解,包括数据库锁基本知识.表锁.表读锁.表写锁.行锁.MVCC.事务的隔离级别.悲观锁.乐观锁.间隙锁GAP.死锁等等,需要的朋友可以参考一下 锁的相关知识又跟存 ...
- ASP.NET 获取客户端IP地址
我们用Request.ServerVariables( "REMOTE_ADDR ") 来取得客户端的IP地址, 但如果客户端是使用代理服务器来访问,那取到的就是代理服务器的I ...
- Typora图片一键传——picgo使用兰空图床
Typora picgo使用兰空图床 最近smms图床免费版的速度眼看着越来越慢,特别是到晚上,图片几乎是在原地打转,于是我想替换掉Typora中picgo默认使用的smms图床,网上的教程清一色地只 ...
- ValidatorException-异常
Java在发送Https请求的时候,不可避免的会发生SSL证书认证失败 错误信息:sun.security.validator.ValidatorException: PKIX path buildi ...
- React.Component 和 React.PureComponent 、React.memo 的区别
一 结论 React.Component 是没有做任何渲染优化的,但凡调用this.setState 就会执行render的刷新操作. React.PureComponent 是继承自Componen ...