在父页面调用子页面的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 相关文章推荐
jQuery点击tr实现checkbox选中的方法
Mar 19 Javascript
运算符&amp;&amp;的三个不同层次
Apr 07 Javascript
Javascript Web Slider 焦点图示例源码
Oct 10 Javascript
js判断上传文件的类型和大小示例代码
Oct 18 Javascript
checkbox勾选判断代码分析
Jun 11 Javascript
微信企业号开发之微信考勤Cookies的使用
Sep 11 Javascript
AngularJS入门教程之 XMLHttpRequest实例讲解
Jul 27 Javascript
使用微信小程序开发前端【快速入门】
Dec 05 Javascript
Angular2 http jsonp的实例详解
Aug 31 Javascript
JS实现常见的查找、排序、去重算法示例
May 21 Javascript
vue页面引入three.js实现3d动画场景操作
Aug 10 Javascript
JS算法教程之字符串去重与字符串反转
Dec 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
2019年漫画销量排行榜:鬼灭登顶 海贼单卷制霸 尾田盛赞鬼灭
2020/03/08 日漫
php中用数组的方法设置cookies
2011/04/21 PHP
关于php内存不够用的快速解决方法
2013/10/26 PHP
php使用递归函数实现数字累加的方法
2015/03/16 PHP
PHP数组操作――获取数组最后一个值的方法
2015/04/14 PHP
一个对于Array的简单扩展
2006/10/03 Javascript
extJS中常用的4种Ajax异步提交方式
2014/03/07 Javascript
javascript中this指向详解
2016/04/23 Javascript
基于JS实现textarea中获取动态剩余字数的方法
2016/05/25 Javascript
JS移动端/H5同时选择多张图片上传并使用canvas压缩图片
2017/06/20 Javascript
vue项目中axios请求网络接口封装的示例代码
2018/12/18 Javascript
Vue动态组件与异步组件实例详解
2019/02/23 Javascript
vue2.0结合Element-ui实战案例
2019/03/06 Javascript
在Vue项目中使用jsencrypt.js对数据进行加密传输的方法
2019/04/17 Javascript
Vue路由对象属性 .meta $route.matched详解
2019/11/04 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
2020/11/05 Javascript
Vue项目如何引入bootstrap、elementUI、echarts
2020/11/26 Vue.js
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
2020/12/25 Vue.js
[03:12]完美世界DOTA2联赛PWL DAY7集锦
2020/11/06 DOTA
Python将xml和xsl转换为html的方法
2015/03/10 Python
安装dbus-python的简要教程
2015/05/05 Python
Python制作爬虫采集小说
2015/10/25 Python
深入浅析python中的多进程、多线程、协程
2016/06/22 Python
Python浮点数四舍五入问题的分析与解决方法
2019/11/19 Python
Vs Code中8个好用的python 扩展插件
2020/10/12 Python
Python实现小黑屋游戏的完整实例
2021/01/06 Python
python 实现有道翻译功能
2021/02/26 Python
html5定位并在百度地图上显示的示例
2014/04/27 HTML / CSS
法国美发器材和产品购物网站:Beauty Coiffure
2016/12/05 全球购物
C#中类(class)与结构(struct)的异同
2013/11/03 面试题
毕业生在校学习的自我评价分享
2013/10/08 职场文书
简历自我评价模版
2014/01/31 职场文书
乡镇消防工作实施方案
2014/03/27 职场文书
党支部遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
2016年优秀党员教师先进事迹材料
2016/02/29 职场文书
JavaScript实现贪吃蛇游戏
2021/06/16 Javascript