多层iframe嵌套的时候,取最底层iframe页面鼠标点击的XY坐标,
IE下测试通过~
/**
* 获取最底层iframe页面中鼠标点击的位置
*/
function getPosition_Iframe(){
var parentWindow = window.parent;
var tmpLocation = window.location;
var target = null;
var left=0;
var top=0;
while(parentWindow!=null && typeof(parentWindow)!='undefined' && tmpLocation!=parentWindow.location){
for(var x=0;x< parentWindow.frames.length;x++){
if(tmpLocation == parentWindow.frames[x].location){
target = parentWindow.frames[x].frameElement;
break;
}
}
do {
left += target.offsetLeft - target.scrollLeft|| 0;
top += target.offsetTop - target.scrollTop || 0;
target = target.offsetParent;
} while(target);
tmpLocation=parentWindow.location;
parentWindow = parentWindow.parent;
}
return {x:left+window.event.clientX,y:top+window.event.clientY};
}
分享到:
相关推荐
点击链接后,应该会在浏览器中看到一个弹出框,内容是“我是测试页面test”,这表明我们已经成功通过jQuery获取到了iframe中的DOM元素。 需要注意的是,使用jQuery操作iframe中的DOM时,必须确保iframe已经完全加载...
标题 "拖拽一个iframe中的div 在另一个iframe页面中显示" 描述了在Web开发中一个交互性的技术,涉及跨框架(iframe)通信和DOM操作。这个技术主要应用于创建富交互的用户界面,允许用户在不同的iframe之间传递和操作...
在***中实现点击左边页面链接时,右边iframe框架显示对应链接页面的内容,是一种常见的网页布局模式,经常被用于后台管理系统中。这种布局允许用户在一个窗口内操作导航,而在另一个子窗口内查看和处理内容,从而...
在网页开发中,有时我们需要在一个页面(子页面)中访问另一个页面(父页面)的数据或控制元素,这种情况下,`Iframe` 提供了一个解决方案。本文将深入探讨如何通过 `Iframe` 获取父页面的变量和控件。 首先,我们...
如果`iframe`加载的页面与主页面不在同一个域下,由于同源策略的限制,你可能无法直接在父页面中对`iframe`进行操作。此时,你需要在`iframe`内部的页面中处理右键菜单的禁用,或者使用`postMessage`和`message`事件...
本篇文章将详细讲解如何利用jQuery实现iframe页面的切换功能,以便于创建更丰富的用户体验和更高效的页面加载策略。 首先,我们需要理解iframe的基本概念。Iframe(Inline Frame)是HTML中的一个元素,它允许我们在...
例如,可以通过document.frames['frameName']或者document.getElementById('frameId')获取iframe元素,然后可以修改其location属性,从而在指定的iframe中加载新的URL。例如:document.frames['frameName'].location...
在本例中,我们使用`iframe`与Bootstrap的导航组件配合,实现点击导航栏时,无刷新切换页面内容。Bootstrap是一个流行的前端开发框架,提供了丰富的预设样式和组件,如响应式导航栏,可以简化我们的开发工作。 首先...
- **`$(selector).contents().find()`**:使用jQuery选择器获取子页面中的元素。 - **`.load()`事件**:监听子页面的加载完成事件,以便在子页面加载后执行某些操作。 - **`.on()`和`.off()`**:在子页面上绑定或...
本文将基于提供的文件信息,深入解析父页面如何获取iframe子页面的数据,以及iframe子页面如何获取父页面的数据。 ### 父页面获取iframe子页面的数据 #### 使用jQuery获取iframe内的元素 在jQuery中,可以通过`...
当遇到"Iframe中页面显示不全"的问题时,通常是由于iframe的尺寸设置不当或者与被嵌入内容的尺寸不匹配导致的。下面将详细探讨如何解决这一问题以及相关的知识点。 首先,我们需要了解`<iframe>`的基本结构和属性。...
在网页开发中,`iframe`(Inline Frame)是一种非常实用的元素,它可以将一个完整的HTML文档嵌入到当前页面中,常用于实现页面组件化、加载外部内容或隐藏页面加载等场景。本篇文章将深入探讨两个关键知识点:`...
在不考虑iframe的情况下,不同浏览器对获取鼠标点击位置相对于屏幕的坐标(screenX和screenY)具有较好的一致性。简单来说,可以通过如下代码获取: ```javascript function getMousePos(event){ var e = event ||...
4. 将iframe添加到页面的body中,并获取iframe的contentWindow.document对象,为打印做准备。 5. 将打印区域的内容写入iframe的文档中,可以通过添加link元素引入打印专用的CSS样式。 6. 将iframe聚焦,并调用`print...
ASP.NET 中使用 iframe 动态加载页面 ASP.NET 中使用 iframe 动态加载页面是指在 ASP.NET 应用程序中使用 iframe 元素来加载外部页面或资源的技术。这种技术可以使得开发者更方便地在应用程序中嵌入外部资源,提高...
在Vue.js中实现嵌套页面通常涉及到使用`iframe`元素来加载外部网页或者内部组件。`iframe`允许我们在一个Vue应用中嵌入另一个独立的HTML文档,这对于展示第三方内容、实现某些特定功能或者处理复杂交互场景时非常...
首先在父页面的javascript给定义一个window.name,并赋予一个字符串值,如window.name="test",其中赋予的字符串值可以随意定义,然后在Iframe页面的Form 标签中定义target属性,并且其值也必须与之前定义的window....
就想弄一个winform结合html5的一个小东西,突有心血来潮,想在里面嵌套一个微信网页版,下面小编给大家介绍下HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版的实现方法,一起看看吧
js控制/获取a.html中iframe加载的b.html中的iframe,很多人都以为getElementById可以直接获取,其实不行的,以上代码就解决了这个问题,js控制iframe加载页面的iframe,不过测试只在IE和火狐通过,谷歌不行,其他自...
总结,`iframe`中的JavaScript交互涉及到页面间的通信,无论是父页面调用子页面还是子页面调用父页面,都需要理解`window`对象、同源策略以及跨域通信机制。正确使用这些技术,可以在多页面应用中实现更复杂的功能...