iframe子页面js调用父页面js函数/父页面调用Iframe子页面中js方法
2014-02-19 11:00
537 查看
一、iframe页面里的js调用父级页面js函数
1、假设当前页面为a.html, iframe的src页面为b.html,其代码如下:
2、b.html里的页面元素为:
</body>
</html>
二、父页面调用Iframe页面中js方法
1、test.js内容
function testJs()
{
alert('JS');
}
2、Children.html内容
<html>
<head>
<title></title>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
</body>
</html>
3、parent.html内容
<head>
<title></title>
<script type="text/javascript" >
var obj=self.frames[0];
obj.testJs();
</script>
</head>
<body>
</body>
</html>
1、假设当前页面为a.html, iframe的src页面为b.html,其代码如下:
<html> <head> <title></title> </head> <body> <p>iframe页面里的js调用父级页面js函数的demo</p> <iframeframeborder="0"width="0"height="0" name="test" src="b.html"> </iframe> <p id="p_nr"></p> </body> <scripttype="text/javascript"> function testParent(){ alert('Parent'); } </script> </html>
2、b.html里的页面元素为:
<html> <head> <title></title> </head> <body> <script type='text/javascript'> window.parent.document.getElementById('p_nr').innerHTML ='内容';//控制父级页面的元素 window.parent.testParent();//调用父级页面的Js函数 </script>
</body>
</html>
二、父页面调用Iframe页面中js方法
1、test.js内容
function testJs()
{
alert('JS');
}
2、Children.html内容
<html>
<head>
<title></title>
<script type="text/javascript" src="test.js"></script>
</head>
<body>
</body>
</html>
3、parent.html内容
<head>
<title></title>
<script type="text/javascript" >
var obj=self.frames[0];
obj.testJs();
</script>
</head>
<body>
</body>
</html>
相关文章推荐
- js浏览器兼容问题总结及解决办法
- JavaScript专业八级测试,答案
- javascript学习总结
- jsp分页功能的实现
- 用jxl 从jsp页面导出数据到excel表格并下载保存
- js 获取、清空input type="file"的值示例代码
- js实现身份证号码验证的简单实例
- 超实用的JavaScript技巧及最佳实践
- js实现表格字段排序
- js匀速滑动div
- JS实现仿百度输入框自动匹配功能的示例代码
- 关于判断IE的JS代码
- 迷你MVVM框架 avalonjs 1.2发布
- J2EE——Jsp的学习
- 原生js--addEventListener和attachEvent的区别
- JavaScript专业八级测试,你能做对几道?
- D3.js学习记录【转】【新】
- JS将数字转换成三位逗号分隔的样式(示例代码)
- js冒泡排序,快速排序,插入排序
- 最流行的JavaScript代码规范