iframe子父页面调用js函数示例


Posted in Javascript onNovember 07, 2013

1、iframe子页面调用父页面js函数

子页面调用父页面函数只需要写上window.praent就可以了。比如调用a()函数,就写成:

window.parent.a();

子页面取父页面中的标签中的值,比如该标签的id为“test”,则:
window.parent.document.getElementById("test").value; jQuery方法为: 
$(window.parent.document).contents().find("test").val();

但是我在chrome浏览器下却发现此方法无效了!查了半天才了解,在chrome 5+中,window.parent无法在file://协议中运行,但是发布了之后http://协议下是可以运行的。此方法支持ie、firefox浏览器。

2、iframe父页面调用子页面js函数

这个就稍微复杂一些,下面的方法支持ie和firefox浏览器: document.getElementById('ifrtest').contentWindow.b(); 
子页面取父页面中的标签中的值,比如该标签的id为“test”,则: 
document.getElementById("test").value;

注:ifrtest是iframe框架的id,b()为子页面js函数。contentWindow属性是指定的frame或者iframe所在的window对象,IE下可以省略。
Javascript 相关文章推荐
表单内同名元素的控制
Nov 22 Javascript
JS中实现简单Formatter函数示例代码
Aug 19 Javascript
JavaScript中原型和原型链详解
Feb 11 Javascript
js跨域请求的5中解决方式
Jul 02 Javascript
jQuery实现图片加载完成后改变图片大小的方法
Mar 29 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
Oct 05 Javascript
JS获取数组中出现次数最多及第二多元素的方法
Oct 27 Javascript
Vue中对比scoped css和css module的区别
May 17 Javascript
深入理解webpack process.env.NODE_ENV配置
Feb 23 Javascript
Node.js API详解之 V8模块用法实例分析
Jun 05 Javascript
vue项目使用$router.go(-1)返回时刷新原来的界面操作
Jul 26 Javascript
jQuery实现影院选座订座效果
Apr 13 jQuery
Jquery通过Ajax方式来提交Form表单的具体实现
Nov 07 #Javascript
Checbox的操作含已选、未选及判断代码
Nov 07 #Javascript
js操作label给label赋值及取label的值示例
Nov 07 #Javascript
js实现幻灯片播放图片示例代码
Nov 07 #Javascript
JS实现定时页面弹出类似QQ新闻的提示框
Nov 07 #Javascript
得到form下的所有的input的js代码
Nov 07 #Javascript
基于jquery插件制作左右按钮与标题文字图片切换效果
Nov 07 #Javascript
You might like
用IE远程创建Mysql数据库的简易程序
2006/10/09 PHP
以文本方式上传二进制文件的PHP程序
2006/10/09 PHP
Apache2 httpd.conf 中文版
2006/11/17 PHP
PHP判断变量是否为0的方法
2014/02/08 PHP
JS学习之一个简易的日历控件
2010/03/24 Javascript
JQquery的一些使用心得分享
2012/08/01 Javascript
js 上下左右键控制焦点(示例代码)
2013/12/14 Javascript
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
2014/03/08 Javascript
js获取客户端网卡的IP地址、MAC地址
2014/03/26 Javascript
JavaScript隐式类型转换
2016/03/15 Javascript
jQuery原理系列-常用Dom操作详解
2016/06/07 Javascript
node.js中express-session配置项详解
2017/05/31 Javascript
Angular.js自动化测试之protractor详解
2017/07/07 Javascript
vue购物车插件编写代码
2017/11/27 Javascript
Bootstrap实现翻页效果
2017/11/27 Javascript
Mint UI实现A-Z字母排序的城市选择列表
2018/12/28 Javascript
layui给下拉框、按钮状态、时间赋初始值的方法
2019/09/10 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
2019/09/26 Javascript
python设置检查点简单实现代码
2014/07/01 Python
跟老齐学Python之赋值,简单也不简单
2014/09/24 Python
python使用socket进行简单网络连接的方法
2015/04/29 Python
Python的Flask框架应用调用Redis队列数据的方法
2016/06/06 Python
python解决网站的反爬虫策略总结
2016/10/26 Python
Python logging管理不同级别log打印和存储实例
2018/01/19 Python
Python cookbook(数据结构与算法)将序列分解为单独变量的方法
2018/02/13 Python
python儿童学游戏编程知识点总结
2019/06/03 Python
python处理自动化任务之同时批量修改word里面的内容的方法
2019/08/23 Python
PyCharm专业最新版2019.1安装步骤(含激活码)
2019/10/09 Python
求职信范文怎么写
2014/01/29 职场文书
学校志愿者活动总结
2014/06/27 职场文书
2014年组织部工作总结
2014/11/14 职场文书
2014年营销工作总结
2014/11/22 职场文书
2015初一年级组工作总结
2015/07/24 职场文书
python通过opencv调用摄像头操作实例分析
2021/06/07 Python
vue+elementui 实现新增和修改共用一个弹框的完整代码
2021/06/08 Vue.js
苹果可能正在打击不进行更新的 App
2022/04/24 数码科技