在父页面调用子页面的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 动画基础教程
Dec 25 Javascript
Javascript 强制类型转换函数
May 17 Javascript
JQuery打造PHP的AJAX表单提交实例
Nov 03 Javascript
jQuery学习总结之元素的相对定位和选择器(持续更新)
Apr 26 Javascript
jQuery EasyUI API 中文文档 可调整尺寸
Sep 29 Javascript
passwordStrength 基于jquery的密码强度检测代码使用介绍
Oct 08 Javascript
jQuery-ui引入后Vs2008的无智能提示问题解决方法
Feb 10 Javascript
JS产生随机数的用法小结
Dec 10 Javascript
JavaScript实现QQ聊天消息展示和评论提交功能
May 22 Javascript
获取url中用&amp;隔开的参数实例(分享)
May 28 Javascript
Webpack devServer中的 proxy 实现跨域的解决
Jun 15 Javascript
使用Node.js在深度学习中做图片预处理的方法
Sep 18 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
thinkphp备份数据库的方法分享
2015/01/04 PHP
Nigma vs AM BO3 第二场2.13
2021/03/10 DOTA
div+css+js实现无缝滚动类似marquee无缝滚动兼容firefox
2013/08/29 Javascript
兼容主流浏览器的iframe自适应高度js脚本
2014/01/10 Javascript
关于Javascript回调函数的一个妙用
2016/08/29 Javascript
EditPlus中的正则表达式 实战(4)
2016/12/15 Javascript
详解vue express启动数据服务
2017/07/05 Javascript
解决Jquery下拉框数据动态获取的问题
2018/01/25 jQuery
vue的token刷新处理的方法
2018/07/17 Javascript
Vue 路由 过渡动效 数据获取方法
2018/07/31 Javascript
NodeJS读取分析Nginx错误日志的方法
2019/05/14 NodeJs
vue实现条件叠加搜索的解决方法
2019/05/28 Javascript
python脚本实现查找webshell的方法
2014/07/31 Python
Python通过DOM和SAX方式解析XML的应用实例分享
2015/11/16 Python
Python 遍历列表里面序号和值的方法(三种)
2017/02/17 Python
Python cookbook(数据结构与算法)找出序列中出现次数最多的元素算法示例
2018/03/15 Python
使用Py2Exe for Python3创建自己的exe程序示例
2018/10/31 Python
Python numpy.zero() 初始化矩阵实例
2019/11/27 Python
Python实现图像去噪方式(中值去噪和均值去噪)
2019/12/18 Python
如何更改 pandas dataframe 中两列的位置
2019/12/27 Python
pandas 数据类型转换的实现
2020/12/29 Python
html5-websocket基于远程方法调用的数据交互实现
2012/12/04 HTML / CSS
Canvas 文本填充线性渐变的使用详解
2020/06/22 HTML / CSS
Lookfantastic德国官网:英国知名美妆购物网站
2017/06/11 全球购物
翻译专业应届生求职信
2013/11/23 职场文书
前台接待岗位职责
2013/12/03 职场文书
大学生实习自我鉴定
2013/12/11 职场文书
奥巴马演讲稿
2014/01/08 职场文书
导购员的岗位职责
2014/02/08 职场文书
文明餐桌活动方案
2014/02/11 职场文书
收款委托书
2014/10/14 职场文书
环境卫生工作汇报材料
2014/10/28 职场文书
教代会闭幕词
2015/01/28 职场文书
Python竟然能剪辑视频
2021/05/25 Python
Elasticsearch 配置详解
2022/04/19 Java/Android
Tomcat 与 maven 的安装与使用教程
2022/06/16 Servers