在父页面调用子页面的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读取xml
Nov 04 Javascript
Javascript Jquery 遍历Json的实现代码
Mar 31 Javascript
UserData用法总结 lanyu出品
Jul 01 Javascript
jquery中attr和prop的区别分析
Mar 16 Javascript
jQuery的end()方法使用详解
Jul 15 Javascript
基于jquery实现日历签到功能
Sep 11 Javascript
js获取鼠标位置实例详解
Dec 09 Javascript
基于BootStrap Metronic开发框架经验小结【四】Bootstrap图标的提取和利用
May 12 Javascript
JavaScript中Form表单技术汇总(推荐)
Jun 26 Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
Feb 21 Javascript
小程序Scroll-view上拉滚动刷新数据
Jun 21 Javascript
浅谈JavaScript中this的指向更改
Jul 28 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部分常见问题总结
2006/10/09 PHP
用session做客户验证时的注意事项
2006/10/09 PHP
PHP 杂谈《重构-改善既有代码的设计》之五 简化函数调用
2012/05/07 PHP
兼容各大浏览器带关闭按钮的漂浮多组图片广告代码
2014/06/05 PHP
php通过array_push()函数添加多个变量到数组末尾的方法
2015/03/18 PHP
PHP-FPM和Nginx的通信机制详解
2019/02/01 PHP
PHP 进程池与轮询调度算法实现多任务的示例代码
2019/11/26 PHP
jquery(live)中File input的change方法只起一次作用的解决办法
2011/10/21 Javascript
JavaScript 原型继承
2011/12/26 Javascript
『jQuery』.html(),.text()和.val()的概述及使用
2013/04/22 Javascript
用nodejs写的一个简单项目打包工具
2013/05/11 NodeJs
JQuery调webservice实现邮箱验证(检测是否可用)
2013/05/21 Javascript
常用的JavaScript模板引擎介绍
2015/02/28 Javascript
JavaScript函数柯里化详解
2016/04/29 Javascript
springMvc 前端用json的方式向后台传递对象数组方法
2018/08/07 Javascript
如何解决webpack-dev-server代理常切换问题
2019/01/09 Javascript
微信小程序分包加载代码实现方法详解
2019/09/23 Javascript
javascript 高级语法之继承的基本使用方法示例
2019/11/11 Javascript
python自动化工具日志查询分析脚本代码实现
2013/11/26 Python
Python中的pass语句使用方法讲解
2015/05/14 Python
python抓取网页中图片并保存到本地
2015/12/01 Python
PyGame贪吃蛇的实现代码示例
2018/11/21 Python
Python网络爬虫之爬取微博热搜
2019/04/18 Python
python多线程下信号处理程序示例
2019/05/31 Python
浅谈PySpark SQL 相关知识介绍
2019/06/14 Python
Python 实现毫秒级淘宝抢购脚本的示例代码
2019/09/16 Python
Mysql数据库反向生成Django里面的models指令方式
2020/05/18 Python
selenium+python自动化78-autoit参数化与批量上传功能的实现
2021/03/04 Python
HTML5实现无刷新修改URL的方法
2019/11/14 HTML / CSS
美国高级音响品牌:Master&Dynamic
2018/07/05 全球购物
大学生求职简历的自我评价范文
2013/10/12 职场文书
《地震中的父与子》教学反思
2014/04/10 职场文书
学生退学证明
2015/06/23 职场文书
pandas:get_dummies()与pd.factorize()的用法及区别说明
2021/05/21 Python
关于MySQL中的 like操作符详情
2021/11/17 MySQL
磁贴还没死, 微软Win11可修改注册表找回Win10开始菜单
2021/11/21 数码科技