父元素与子iframe相互获取变量和元素对象的具体实现


Posted in Javascript onOctober 15, 2013

父中:

<input id="username"type="text" /> 
<scripttype="text/javascript"> 
var count = 1; 
</script>

-------------------------------------------------------------
子iframe中:
<scripttype="text/javascript"> 
alert(window.parent.count); //获取父中的js变量 
alert($("#username", window.parent.document));//获取父中jQuery对象 
alert(window.parent.document.getElementByIdx_x('username'));//获取父中DOM对象 
</script>

--------------------------------------------------------------------------------------------------

子iframe中(id="iframeId"name="iframeName"):

<input id="username"type="text" /> 
<scripttype="text/javascript"> 
varcount = 1; 
</script>

-------------------------------------------------------------
父中:
<scripttype="text/javascript"> 
alert(document.iframeName.count);//获取子iframe中的js变量 
alert($(window.frames["iframeName"].document).contents().find("#username"));//获取子iframe中jQuery对象 
alert($("#username",document.frames("iframeName").document));//获取子iframe中jQuery对象 
alert(window.document.getElementById('iframeId').contentWindow.document.getElementByIdx_x('username'));//获取子iframe中DOM对象 
</script>

收集网上的一些示例:
用jQuery在IFRAME里取得父窗口的某个元素的值
只好用DOM方法与jquery方法结合的方式实现了

1. 在父窗口中操作 选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input:radio").attr("checked","true");
2. 在IFRAME中操作 选中父窗口中的所有单选钮
$(window.parent.document).find("input:radio").attr("checked","true");
父窗口想获得IFrame中的Iframe,就再加一个frames子级就行了,如:
$(window.frames["iframe1"].frames["iframe2"].document).find("input:radio").attr("checked","true");
3.在子窗口中调用父窗口中的另一个子窗口的方法(FRAME):
parent.frames["Main"].Fun();
注意:建议使用[],这样比较兼容多个浏览器,()火狐/搜狗/谷歌不兼容。

Javascript 相关文章推荐
javaScript - 如何引入js代码
Mar 09 Javascript
鼠标移动到一张图片时变为另一张图片
Dec 05 Javascript
Mootools 1.2教程 滑动效果(Slide)
Sep 15 Javascript
javascript 多种搜索引擎集成的页面实现代码
Jan 02 Javascript
javascript中的array数组使用技巧
Jan 31 Javascript
js调试系列 控制台命令行API使用方法
Jun 18 Javascript
jQuery实现鼠标选文字发新浪微博的方法
Apr 02 Javascript
有关文件上传 非ajax提交 得到后台数据问题
Oct 12 Javascript
解决VUE中document.body.scrollTop为0的问题
Sep 15 Javascript
jQuery内容选择器与表单选择器实例分析
Jun 28 jQuery
详解关闭令人抓狂的ESlint 语法检测配置方法
Oct 28 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
Jan 18 Javascript
纯Javascript实现Windows 8 Metro风格实现
Oct 15 #Javascript
自定义ExtJS控件之下拉树和下拉表格附源码
Oct 15 #Javascript
Javascript 实现的数独解题算法网页实例
Oct 15 #Javascript
高效的获取当前元素是父元素的第几个子元素
Oct 15 #Javascript
JS 实现点击a标签的时候让其背景更换
Oct 15 #Javascript
JS操作Cookies的小例子
Oct 15 #Javascript
如何在父窗口中得知window.open()出的子窗口关闭事件
Oct 15 #Javascript
You might like
ThinkPHP数据操作方法总结
2015/09/28 PHP
php常用字符串长度函数strlen()与mb_strlen()用法实例分析
2019/06/25 PHP
yii2.0框架实现上传excel文件后导入到数据库的方法示例
2020/04/13 PHP
jQuery 添加/移除CSS类实现代码
2010/02/11 Javascript
jQuery AjaxQueue改进步骤
2011/10/06 Javascript
代码获取历史上的今天发生的事
2014/04/11 Javascript
jQuery实现页面滚动时动态加载内容的方法
2015/03/20 Javascript
JQuery简单实现锚点链接的平滑滚动
2015/05/03 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
2015/10/23 Javascript
js命名空间写法示例
2015/12/18 Javascript
layui监听select变化,以及设置radio选中的方法
2019/09/24 Javascript
vuejs中父子组件之间通信方法实例详解
2020/01/17 Javascript
jquery将信息遍历到界面上实例代码
2020/01/21 jQuery
js中调用微信的扫描二维码功能的实现代码
2020/04/11 Javascript
浅谈Tensorflow由于版本问题出现的几种错误及解决方法
2018/06/13 Python
Selenium(Python web测试工具)基本用法详解
2018/08/10 Python
python3 map函数和filter函数详解
2019/08/26 Python
python的命名规则知识点总结
2019/10/04 Python
python中dict()的高级用法实现
2019/11/13 Python
python 双循环遍历list 变量判断代码
2020/05/04 Python
Python 实现将某一列设置为str类型
2020/07/14 Python
Python grpc超时机制代码示例
2020/09/14 Python
Scrapy基于scrapy_redis实现分布式爬虫部署的示例
2020/09/29 Python
Viking Direct荷兰:购买办公用品
2019/06/20 全球购物
火山咖啡:Volcanica Coffee
2019/10/29 全球购物
Flesh Beauty官网:露华浓集团旗下彩妆品牌
2021/02/15 全球购物
Python面试题:如何用Python来发送邮件
2016/03/15 面试题
Structs界面控制层技术
2013/10/11 面试题
高校教师岗位职责
2014/03/18 职场文书
房产公证书样本
2015/01/23 职场文书
狮子林导游词
2015/02/03 职场文书
春秋淹城导游词
2015/02/11 职场文书
2015年高三班主任工作总结
2015/05/21 职场文书
K8s部署发布Golang应用程序的实现方法
2021/07/16 Golang
python读取并查看npz/npy文件数据以及数据显示方法
2022/04/14 Python
MySQL数据库Innodb 引擎实现mvcc锁
2022/05/06 MySQL