jQuery实现iframe父窗体和子窗体的相互调用


Posted in Javascript onJune 17, 2016

本文实例讲述了jQuery实现iframe父窗体和子窗体的相互调用方法。分享给大家供大家参考,具体如下:

父窗体

<html>
  <head>
    <title>usually function</title>
  </head>
  <body>
    <iframe src="http://www.baidu.com" ></iframe>
    <iframe src="myifame.html" id="name_iframe" name="name_iframe"></iframe>
    <button value="buttonvalue" id="testid">buttonvalue</button>
  </body>
<html>
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script>
//contentWindow这个属性,相当于获取iframe网页里面的window对象
$(function(){
  //父窗体获取子窗体的变量
  alert(document.getElementById("name_iframe").contentWindow.vname);//父窗体获取子窗体的方法
  document.getElementById("name_iframe").contentWindow.test();//父窗体获取子窗体的内容
  alert(document.getElementById("name_iframe").contentWindow.document.body.outerHTML);
});
var myname="hb";
function parentFunction(){
  alert("parentFunction");
}
</script>

子窗体

<html>
  <head>
    <title>usually function</title>
  </head>
  <body>
    <button onclick="getParentContent()">getParentContent</button>
  </body>
<html>
<script type="text/javascript" src="jquery-1.4.4.js"></script>
<script>
var vname="v_name";
function test(){
  alert("function test");
}
function getParentContent(){
  //获取父窗体的变量
  alert(window.parent.myname);
  //获取父窗体的方法
  window.parent.parentFunction();
  //获取父窗体的dom节点
  alert(parent.document.getElementById("testid").value);
}
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript 对话框和状态栏使用说明
Oct 25 Javascript
Jquery乱码的一次解决过程 图解教程
Feb 20 Javascript
js随机颜色代码的多种实现方式
Apr 23 Javascript
jquery提交form表单简单示例分享
Mar 03 Javascript
js获取下拉列表的值和元素个数示例
May 07 Javascript
jquery实现多行文字图片滚动效果示例代码
Oct 10 Javascript
javascript实现时间格式输出FormatDate函数
Jan 13 Javascript
jQuery实现布局高宽自适应的简单实例
May 28 Javascript
基于vue.js路由参数的实例讲解——简单易懂
Sep 07 Javascript
Node.js assert断言原理与用法分析
Jan 04 Javascript
jQuery实现轮播图效果
Nov 26 jQuery
node.js文件的复制、创建文件夹等相关操作
Feb 05 Javascript
JS工作中的小贴士之”闭包“与事件委托的”阻止冒泡“
Jun 16 #Javascript
JS阻止事件冒泡行为和闭包的方法
Jun 16 #Javascript
jquery实现简单Tab切换菜单效果
Jul 17 #Javascript
特殊日期提示功能的实现方法
Jun 16 #Javascript
JS代码实现根据时间变换页面背景效果
Jun 16 #Javascript
基于JS代码实现图片在页面中旋转效果
Jun 16 #Javascript
客户端验证用户名和密码的方法详解
Jun 16 #Javascript
You might like
咖啡的化学
2021/03/03 咖啡文化
一个从别的网站抓取信息的例子(域名查询)
2006/10/09 PHP
PHP禁止页面缓存的代码
2011/10/23 PHP
PHP漏洞全解(详细介绍)
2012/11/13 PHP
PHP基于PDO实现的SQLite操作类【包含增删改查及事务等操作】
2017/06/21 PHP
PHP Post获取不到非表单数据的问题解决办法
2018/02/27 PHP
总结PHP中初始化空数组的最佳方法
2019/02/13 PHP
Javascript里使用Dom操作Xml
2007/01/22 Javascript
List Installed Software Features
2007/06/11 Javascript
javascript+mapbar实现地图定位
2010/04/09 Javascript
juqery 学习之五 文档处理 包裹、替换、删除、复制
2011/02/11 Javascript
ASP.NET中AJAX 调用实例代码
2012/05/03 Javascript
js阻止冒泡及jquery阻止事件冒泡示例介绍
2013/11/19 Javascript
详解Document.Cookie
2015/12/25 Javascript
WebPack基础知识详解
2017/01/16 Javascript
bootstrap折叠调用collapse()后data-parent不生效的快速解决办法
2017/02/23 Javascript
Vue打包后出现一些map文件的解决方法
2018/02/13 Javascript
vue动态改变背景图片demo分享
2018/09/13 Javascript
JavaScript继承的特性与实践应用深入详解
2018/12/30 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
2019/08/16 Javascript
vue实现登录拦截
2020/06/29 Javascript
python简单实现计算过期时间的方法
2015/06/09 Python
Python制作爬虫抓取美女图
2016/01/20 Python
Python之str操作方法(详解)
2017/06/19 Python
浅谈numpy数组的几种排序方式
2017/12/15 Python
Python基于分析Ajax请求实现抓取今日头条街拍图集功能示例
2018/07/19 Python
Python实现报警信息实时发送至邮箱功能(实例代码)
2019/11/11 Python
在脚本中单独使用django的ORM模型详解
2020/04/01 Python
iPython pylab模式启动方式
2020/04/24 Python
PyQt中使用QtSql连接MySql数据库的方法
2020/07/28 Python
python map比for循环快在哪
2020/09/21 Python
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
介绍一下HTTP、HTTPS和SSL
2012/12/16 面试题
公司年会晚宴演讲稿
2014/01/06 职场文书
保险公司开门红口号
2014/06/21 职场文书
关于迟到的检讨书
2015/05/06 职场文书