js操作iframe父子窗体示例


Posted in Javascript onMay 22, 2014

父窗体获取iframe

window.iframeId

iframe获取父窗口

window.parent

parent.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript"> 
function btnFn(){ 
window.subWin.test(); 
} 
function get(name){ 
return document.getElementById(name); 
} 
</script> 
</head> 
<body> 
<input id="name" type="text" value="222"> 
<input type="button" id="btn" value="点击" onclick="btnFn();"><br/> 
<br/><br/> 
<iframe src="sub.html" id="subWin" 
name="subWin" width="100%" marginwidth="0" height="100%" 
marginheight="0" scrolling="Yes" frameborder="0" valign="middle" 
resize="no" style="display: block;border:3px solid red;"></iframe> </body> 
</html>

sub.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
<script type="text/javascript" > 
function test(){ 
alert(window.parent.get("name").value);//结果:222 
} </script> 
</head> 
<body> 
我是窗体的内容 
</body> 
</html>
Javascript 相关文章推荐
学习YUI.Ext第七日-View&amp;JSONView Part Two-一个画室网站的案例
Mar 10 Javascript
改版了网上的一个js操作userdata
Apr 27 Javascript
Linux下为Node.js程序配置MySQL或Oracle数据库的方法
Mar 19 Javascript
js 中文汉字转Unicode、Unicode转中文汉字、ASCII转换Unicode、Unicode转换ASCII、中文转换
Dec 06 Javascript
canvas快速绘制圆形、三角形、矩形、多边形方法介绍
Dec 29 Javascript
微信小程序 定位到当前城市实现实例代码
Feb 23 Javascript
javascript 通过键名获取键盘的keyCode方法
Dec 31 Javascript
微信小程序仿朋友圈发布动态功能
Jul 15 Javascript
详解关于Vue版本不匹配问题(Vue packages version mismatch)
Sep 17 Javascript
微信小程序返回箭头跳转到指定页面实例解析
Oct 08 Javascript
微信小程序转化为uni-app项目的方法示例
May 22 Javascript
使用Element的InfiniteScroll 无限滚动组件报错的解决
Jul 27 Javascript
JS实现根据当前文字选择返回被选中的文字
May 21 #Javascript
JS动态增加删除UL节点LI及相关内容示例
May 21 #Javascript
jQuery异步验证用户名是否存在示例代码
May 21 #Javascript
jQuery取id有.的值的方法
May 21 #Javascript
jQuery判断复选框是否勾选的原理及示例
May 21 #Javascript
在页面加载完成后通过jquery给多个span赋值
May 21 #Javascript
JS 弹出层 定位至屏幕居中示例
May 21 #Javascript
You might like
解决163/sohu/sina不能够收到PHP MAIL函数发出邮件的问题
2009/03/13 PHP
php中让上传的文件大小在上传前就受限制的两种解决方法
2013/06/24 PHP
为你总结一些php系统类函数
2015/10/21 PHP
WordPress中给媒体文件添加分类和标签的PHP功能实现
2015/12/31 PHP
WordPress的文章自动添加关键词及关键词的SEO优化
2016/03/01 PHP
jQuery的运行机制和设计理念分析
2011/04/05 Javascript
jQuery $.get 的妙用 访问本地文本文件
2012/07/12 Javascript
JQuery分别取得每行最后一列和最后一行的示例代码
2013/08/18 Javascript
JS取文本框中最小值的简单实例
2013/11/29 Javascript
JS对话框_JS模态对话框showModalDialog用法总结
2014/01/11 Javascript
js函数参数设置默认值的一种变通实现方法
2014/05/26 Javascript
jQuery判断checkbox是否选中的3种方法
2014/08/12 Javascript
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
2014/12/16 Javascript
nodejs中实现sleep功能实例
2015/03/24 NodeJs
jquery实现横向图片轮播特效代码分享
2015/11/19 Javascript
Bootstrap Table从服务器加载数据进行显示的实现方法
2016/09/29 Javascript
Javascript 两种刷新方法以及区别和适用范围
2017/01/17 Javascript
聊聊JavaScript如何实现继承及特点
2017/04/07 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
2017/06/26 Javascript
vue src动态加载请求获取图片的方法
2018/10/17 Javascript
vue学习之Vue-Router用法实例分析
2020/01/06 Javascript
Node.js API详解之 module模块用法实例分析
2020/05/13 Javascript
JavaScript实现多层颜色选项卡嵌套
2020/09/21 Javascript
Nuxt 嵌套路由nuxt-child组件用法(父子页面组件的传值)
2020/11/05 Javascript
Python编程中装饰器的使用示例解析
2016/06/20 Python
python实现文本界面网络聊天室
2018/12/12 Python
Python线程之定位与销毁的实现
2019/02/17 Python
15行Python代码实现网易云热门歌单实例教程
2019/03/10 Python
python opencv 批量改变图片的尺寸大小的方法
2019/06/28 Python
Xadmin+rules实现多选行权限方式(级联效果)
2020/04/07 Python
python爬虫中的url下载器用法详解
2020/11/30 Python
使用CSS3来匹配横屏竖屏的简单方法
2015/08/04 HTML / CSS
说出数据连接池的工作机制是什么?
2013/04/19 面试题
演讲稿开场白
2014/01/13 职场文书
2016党风廉政建设心得体会范文
2016/01/25 职场文书
遇事可以测出您的见识与格局
2019/09/16 职场文书