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

本文详细介绍如何使用jQuery实现父页面与子页面(iframe)之间的交互,包括调用子页面函数、修改变量值、操作DOM元素,以及子页面如何反向调用父页面的方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

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');
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值