js父页面中使用子页面的方法


Posted in Javascript onJanuary 09, 2016

iframe是非常常用的一个html元素,如果在父页面中使用子页面的方法应该怎么写呢,下面就做一下简单的介绍。
一、父页面代码

<html>
<head>
<meta charset=" gb2312">
<title>父页面</title>
<script type="text/javascript">
function parentFunction() 
{
 alert('function in parent');
}
function callChild() 
{
 child.window.childFunction();
 /*
  child 为iframe的name属性值,
  不能为id,因为在FireFox下id不能获取iframe对象
 */
}
</script>
</head>
<body>
 <iframe name="child" src="./child.html" ></iframe>
</body>
</html>

二、iframe中的代码

<html>
<head>
<meta charset="gb2312">
<title>iframe代码</title>
<script type="text/javascript">
function childFunction() 
{
 alert('function in child');
}
function callParent() 
{
 parent.parentFunction();
}
</script>
</head>
<body>
</body>
</html>

上面两个代码可以在父页面和子页面对对方的函数进行相互调用,比较简单,不多介绍了。
希望本文所述对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
js 实现图片预加载(js操作 Image对象属性complete ,事件onload 异步加载图片)
Mar 25 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
May 07 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
Jul 04 Javascript
jquery UI Datepicker时间控件的使用方法(基础版)
Nov 07 Javascript
Bootstrap实现带动画过渡的弹出框
Aug 09 Javascript
jQuery复制节点用法示例(clone方法)
Sep 08 Javascript
Vue.js移动端左滑删除组件的实现代码
Sep 08 Javascript
jQuery实现简单的回到顶部totop功能示例
Oct 16 jQuery
使用Vue.js和Flask来构建一个单页的App的示例
Mar 21 Javascript
jQuery实现仿京东防抖动菜单效果示例
Jul 06 jQuery
Vue-cli@3.0 插件系统简析
Sep 05 Javascript
微信小程序实现多个按钮的颜色状态转换
Feb 15 Javascript
jquery调整表格行tr上下顺序实例讲解
Jan 09 #Javascript
实例讲解js验证表单项是否为空的方法
Jan 09 #Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
Jan 09 #Javascript
javascript跑马灯抽奖实例讲解
Apr 17 #Javascript
jQuery页面刷新(局部、全部)问题分析
Jan 09 #Javascript
javascript返回顶部的按钮实现方法
Jan 09 #Javascript
javascript类型系统 Array对象学习笔记
Jan 09 #Javascript
You might like
Godaddy空间Zend Optimizer升级方法
2010/05/10 PHP
php include加载文件两种方式效率比较
2010/08/08 PHP
php中unlink()、mkdir()、rmdir()等方法的使用介绍
2012/12/21 PHP
PHP防止表单重复提交的几种常用方法汇总
2014/08/19 PHP
php输入流php://input使用浅析
2014/09/02 PHP
PHP防止图片盗用(盗链)的方法小结
2016/11/11 PHP
通过继承IHttpHandle实现JS插件的组织与管理
2010/07/13 Javascript
jquery事件机制扩展插件 jquery鼠标右键事件。
2011/12/26 Javascript
Node.js中的缓冲与流模块详细介绍
2015/02/11 Javascript
如何用javascript计算文本框还能输入多少个字符
2015/07/29 Javascript
详解AngularJS实现表单验证
2015/12/10 Javascript
javascript中Date对象应用之简易日历实现
2016/07/12 Javascript
JavaScript校验Number(4,1)格式的数字实例代码
2017/03/13 Javascript
详解在Vue中如何使用axios跨域访问数据
2017/07/07 Javascript
深入理解angular2启动项目步骤
2017/07/15 Javascript
深入理解React高阶组件
2017/09/28 Javascript
微信、QQ、微博、Safari中使用js唤起App
2018/01/24 Javascript
AngularJS监听ng-repeat渲染完成的方法
2018/03/20 Javascript
vue 注册组件的使用详解
2018/05/05 Javascript
利用jqgrid实现上移下移单元格功能
2018/11/07 Javascript
python的三目运算符和not in运算符使用示例
2014/03/03 Python
python爬虫入门教程--利用requests构建知乎API(三)
2017/05/25 Python
python 读写中文json的实例详解
2017/10/29 Python
通过pykafka接收Kafka消息队列的方法
2018/12/27 Python
VPS CENTOS 上配置python,mysql,nginx,uwsgi,django的方法详解
2019/07/01 Python
virtualenv介绍及简明教程
2020/06/23 Python
详解python的xlwings库读写excel操作总结
2021/02/26 Python
纯CSS3绘制打火机动画火焰效果
2016/07/18 HTML / CSS
CSS3 实现弹幕的示例代码
2017/08/07 HTML / CSS
印度领先的在线时尚商店:Koovs
2016/08/28 全球购物
贷款承诺书范文
2014/05/19 职场文书
中药学专业毕业生推荐信
2014/07/10 职场文书
作风建设年活动总结
2014/08/27 职场文书
承诺函格式模板
2015/01/21 职场文书
电力企业职工培训心得体会
2016/01/11 职场文书
动画电影《擅长捉弄人的高木同学》6月10日上映!
2022/03/20 日漫