jQuery iframe父页面和子页面相互调用

悠悠 2022-01-14 10:07 566阅读 0赞

### jQuery操作iframe父子页面相互操作 ###

*   *  父页面调用子页面
     *  子页面调用父页面

## 父页面调用子页面 ##

根据iframe的id找到子页面，取子页面的内容

$('#iframe_dept')[0].contentWindow

1.  **调用函数（function）**
    
        $('#iframe_dept')[0].contentWindow.函数名(参数)
         例如： $('#iframe_dept')[0].contentWindow.chooseDept();
2.  **调用变量**
    
        设置值：
         $('#iframe_dept')[0].contentWindow.变量名 = 值;
         例如： $('#iframe_dept')[0].contentWindow.num = 1;
         获取值
          var n = $('#iframe_dept')[0].contentWindow.变量名;
         例如：var n = $('#iframe_dept')[0].contentWindow.num;
3.  **操作标签**
    
        $('#iframe_dept')[0].contentWindow.$('#id').val('123');

## 子页面调用父页面 ##

利用 window.parent获取父页面的内容

1.  **调用函数（function）**
    
        window.parent.函数名(参数)
        	 例如： window.parent.showDept();
2.  调用变量
    
        设置值：
        	 window.parent.变量名 = 值;
        	 例如： window.parent.num = 1;
         获取值
          	var n = window.parent.变量名;
         	例如：var n =window.parent.num;
3.  **操作标签**

window.parent.$('#id').val('123');

发表评论取消回复

表情：

评论列表（有 0 条评论，566人围观）

还没有评论，来说两句吧...

相关阅读

相关 jquery操作iframe的方法：父页面和子页面相互操作的方法

俩个页面，A为父页面，B为内嵌浏览器套的子页面 A：父页面 <script language="javascript" src="http://www.a

蔚落/ 2023年10月16日 23:33/ 0 赞/ 19 阅读

相关用iframe 进行局部刷新--(子页面,父页面变量和函数互相调用)

（1）主页面（包含iframe）的初始化 <iframe id="myFrameId"></iframe> $("\myFram

缺乏、安全感/ 2022年06月17日 13:28/ 0 赞/ 277 阅读

相关利用iframe进行父页面和子页面的通信

父页面parent.html: <span id='parentSpan'>父页面元素</span> <iframe src="child1.html" i

蔚落/ 2022年06月10日 10:38/ 0 赞/ 241 阅读

相关 html页面中iframe嵌套页面的父页面和子页面js方法互相调用

我们在写html页面或者说是jsp页面是，有时候需要在一个页面中使用iframe标签嵌套另一个页面，而两个页面有些数据需要交互，这个时候就会用到js技术，互相调用方法，当我

﹏ヽ暗。殇╰゛Y/ 2022年06月09日 03:18/ 0 赞/ 568 阅读

相关 iframe——html子页面调用父页面的方法

$( function () \{ //在iframe子页面中查找父页面元素 alert($( '\default' , window.parent.document

心已赠人/ 2022年05月25日 00:36/ 0 赞/ 440 阅读

相关 jQuery Iframe 父页面监听子页面的鼠标点击事件

一、父页面加入iframe： <body> <iframe id="ifrmReport" src="/ReportForm/ZKZProblemSummaryPartia

墨蓝/ 2022年05月15日 08:34/ 0 赞/ 1185 阅读

相关 iframe父页面自适应子页面的高度

我们一般情况下是在子页面获取高度传递给父页面，但是由于存在跨域问题，解决起来不是很方便而 [html5 postMessage解决跨域、跨窗口消息传递][html5 pos

系统管理员/ 2022年04月11日 12:22/ 0 赞/ 446 阅读

相关 iframe 父页面调用子页面方法

<script type="text/javascript"> //调用子页面的方法. var childWi

￡神魔★判官ぃ/ 2022年03月14日 09:36/ 0 赞/ 1211 阅读

相关 jQuery iframe父页面和子页面相互调用

jQuery操作iframe父子页面相互操作父页面调用子页面子页面调用父页面父页面调用子页面根据iframe的id找到子页面，取

悠悠/ 2022年01月14日 10:07/ 0 赞/ 567 阅读

相关 iframe 框架父页面刷新子页面

1.父页面添加： <script>　 function testBtn()\{ 　　 var reshSrc = document.getElementById('

向右看齐/ 2021年09月30日 14:38/ 0 赞/ 741 阅读