父元素与子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 相关文章推荐
Prototype 学习 Prototype对象
Jul 12 Javascript
jQuery版Tab标签切换
Mar 16 Javascript
jquery插件开发注意事项小结
Jun 04 Javascript
javascript从作用域链谈闭包
Jul 29 Javascript
jQuery轻松实现表格的隔行变色和点击行变色的实例代码
May 09 Javascript
Bootstrap实现水平排列的表单
Jul 04 Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
Oct 27 Javascript
微信小程序 HTTPS报错整理常见问题及解决方案
Dec 14 Javascript
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 jQuery
JS 数组随机洗牌的实例代码
Sep 12 Javascript
微信小程序实现多行文字滚动
Nov 18 Javascript
一篇文章了解正则表达式的替换技巧
Feb 24 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
PHP实现网上点歌(二)
2006/10/09 PHP
apache2.2.4+mysql5.0.77+php5.2.8安装精简
2009/04/29 PHP
360通用php防护代码(使用操作详解)
2013/06/18 PHP
php递归使用示例(php递归函数)
2014/02/14 PHP
postfixadmin忘记密码后的修改密码方法详解
2016/07/20 PHP
封装好的一个万能检测表单的方法
2015/01/21 Javascript
AngularJS使用ngMessages进行表单验证
2015/12/27 Javascript
Node.js如何自动审核团队的代码
2016/07/20 Javascript
JavaScript 字符串数字左补位,右补位,取固定长度,截位扩展函数代码
2017/03/25 Javascript
Vue2 使用 Echarts 创建图表实例代码
2017/05/18 Javascript
jquery动态赋值id与动态取id方法示例
2017/08/21 jQuery
JavaScript中Require调用js的实例分享
2017/10/27 Javascript
javascript中toFixed()四舍五入使用方法详解
2018/09/28 Javascript
浅析vue插槽和作用域插槽的理解
2019/04/22 Javascript
layer iframe 设置关闭按钮的方法
2019/09/12 Javascript
微信小程序批量监听输入框对按钮样式进行控制的实现代码
2019/10/12 Javascript
ES6对象操作实例详解
2020/05/23 Javascript
Vue循环中多个input绑定指定v-model实例
2020/08/31 Javascript
解决ant Design Search无法输入内容的问题
2020/10/29 Javascript
[01:05:40]2014 DOTA2国际邀请赛中国区预选赛 5 23 CIS VS DT第三场
2014/05/24 DOTA
Python实现模拟登录及表单提交的方法
2015/07/25 Python
python九九乘法表的实例
2017/09/26 Python
Django添加feeds功能的示例
2018/08/07 Python
python生成lmdb格式的文件实例
2018/11/08 Python
Python代码使用 Pyftpdlib实现FTP服务器功能
2019/07/22 Python
如何理解Python中包的引入
2020/05/29 Python
python 装饰器的实际作用有哪些
2020/09/07 Python
Troy-Bilt官网:草坪割草机、吹雪机、分蘖机等
2019/02/19 全球购物
诺思信科技(南京)有限公司.NET笔试题答案
2013/07/06 面试题
给酒店员工的表扬信
2014/01/11 职场文书
表彰大会主持词
2014/03/26 职场文书
供货协议书
2014/04/22 职场文书
学校交通安全责任书
2014/08/25 职场文书
教师调动申请报告
2015/05/18 职场文书
详解Python牛顿插值法
2021/05/11 Python
JS前端使用canvas实现物体的点选示例
2022/08/05 Javascript