在父页面调用子页面的JS方法


Posted in Javascript onSeptember 29, 2013

今天弄了一天了,终于在网上找到了解决办法

注意:问题是在父页面调用子页面的方法。。。。。

父页面:parent.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>parent</title>
<script>
 function parentFunction() {
  alert('function in parent');
 }
 function callChild() {
  child.window.childFunction();
  /*
   child 为iframe的name属性值,
   不能为id,因为在FireFox下id不能获取iframe对象
  */
 }
</script>
</head>
<body>
<input type="button" name="call child"  value="call child" onclick="callChild()"/>
<br/><br/>
<iframe name="child" src="./child.html" ></iframe>
</body>
</html>

子页面:child.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>child</title>
<script>
 function childFunction() {
  alert('function in child');
 }
 function callParent() {
  parent.parentFunction();
 }
</script>
</head>
<body>
<input type="button" name="call parent" value="call parent" onclick="callParent()"/>
</body>
</html>

大家可以根据自己的需求修改相应的代码即可。。。。。。。
Javascript 相关文章推荐
javascript数组使用调用方法汇总
Dec 08 Javascript
JS学习之一个简易的日历控件
Mar 24 Javascript
extjs中grid中嵌入动态combobox的应用
Jan 01 Javascript
在百度知道团队中快速审批新成员的js脚本
Feb 02 Javascript
JS实现的用来对比两个用指定分隔符分割的字符串是否相同
Sep 19 Javascript
jQuery实现跟随鼠标运动图层效果的方法
Feb 02 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
Vue2递归组件实现树形菜单
Apr 10 Javascript
Vue页面骨架屏注入方法
May 13 Javascript
js自定义input文件上传样式
Oct 26 Javascript
微信小程序用户位置权限的获取方法(拒绝后提醒)
Nov 15 Javascript
用Angular实现一个扫雷的游戏示例
May 15 Javascript
javascript完美拖拽的实现方法
Sep 29 #Javascript
jquery中focus()函数实现当对象获得焦点后自动把光标移到内容最后
Sep 29 #Javascript
js中的scroll和offset 使用比较的实例与分析
Sep 29 #Javascript
jquery判断RadioButtonList和RadioButton中是否有选中项示例
Sep 29 #Javascript
基于jquery实现一张图片点击鼠标放大再点缩小
Sep 29 #Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
Sep 29 #Javascript
jquery事件与函数的使用介绍
Sep 29 #Javascript
You might like
php 执行系统命令的方法
2009/07/07 PHP
php通过正则表达式记取数据来读取xml的方法
2015/03/09 PHP
PHP数组函数array_multisort()用法实例分析
2016/04/02 PHP
php根据年月获取当月天数及日期数组的方法
2016/11/30 PHP
基于jQuery实现模拟页面加载进度条
2013/04/01 Javascript
JS验证身份证有效性示例
2013/10/11 Javascript
基于jQuery+Cookie实现的防止刷新的在线考试倒计时
2015/06/19 Javascript
JS实现仿Windows7风格的网页右键菜单效果代码
2015/09/11 Javascript
利用jQuery实现WordPress中@的ID悬浮显示评论内容
2015/12/11 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
2016/04/25 Javascript
vue.js入门教程之计算属性
2016/09/01 Javascript
JavaScript 中对象的深拷贝
2016/12/04 Javascript
jQuery内存泄露解决办法
2016/12/13 Javascript
JS实现淡入淡出图片效果的方法分析
2016/12/20 Javascript
codeMirror插件使用讲解
2017/01/16 Javascript
常见的浏览器Hack技巧整理
2017/06/29 Javascript
基于构造函数的五种继承方法小结
2017/07/27 Javascript
微信小程序之页面跳转和参数传递的实现
2017/09/29 Javascript
详解vue-property-decorator使用手册
2019/07/29 Javascript
vue项目实现设置根据路由高亮对应的菜单项操作
2020/08/06 Javascript
一篇超完整的Vue新手入门指导教程
2020/11/18 Vue.js
React服务端渲染原理解析与实践
2021/03/04 Javascript
[02:41]辉夜杯现场一家三口 “我爸玩风行 我玩血魔”
2015/12/27 DOTA
使用python分析git log日志示例
2014/02/27 Python
Python多进程同步Lock、Semaphore、Event实例
2014/11/21 Python
Python实现的手机号归属地相关信息查询功能示例
2017/06/08 Python
Django中ORM表的创建和增删改查方法示例
2017/11/15 Python
安装多个版本的TensorFlow的方法步骤
2020/04/21 Python
python pygame 愤怒的小鸟游戏示例代码
2021/02/25 Python
机电专业毕业生推荐信
2013/11/10 职场文书
文明村镇申报材料
2014/05/06 职场文书
实习协议书范本
2014/09/25 职场文书
2014乡镇党委副书记对照检查材料思想汇报
2014/10/09 职场文书
2015年秋季开学典礼校长致辞
2015/07/16 职场文书
观看《信仰》心得体会
2016/01/15 职场文书
vue使用localStorage持久性存储实现评论列表
2022/04/14 Vue.js