iframe子页面与父页面元素的访问以及js变量的访问
1、子页面访问父页面元素
parent.document.getElementById('id')和document相关的方法都可以这样用
2、父页面访问子页面元素
document.getElementById('iframeId').contentDocument.getElementsByTagName('table'); contentDocument后可以使用document相关方法
var tet = document.getElementById('iframeId').contentWindow.document.getElementById("text_inputId");
alert(tet.value);
3、子页面访问父页面js变量(注:父页面的js变量需为全局变量)
子页面var variable = parent.variableParent (variableParent为父页面定义的变量)
4、父页面访问子页面js变量
这部分目前的解决方案是在父页面设置全局变量,在子页面进行修改后将子页面的变量赋值给父页面
5、子页面访问父页面js方法
window.parent.paramMethod();
6、父页面访问子页面js方法
document.getElementById('iframeId').contentWindow.iframeMethod(param);
iframe里面的页面调用父窗口,左右窗口js函数的方法
实现iframe内部页面直接调用该iframe所属父窗口自定义函数的方法。
比如有A窗口,A内有个IFRAME B,B里面的装载的是C页面,这时C要直接调用A里面的一个自定义函数AFUN();
那么只要在C页面中写如下JS函数就可以了:
window.parent.AFUN();
如果AFUN()有参数也可以直接传递合适的参数进去。
例如:
修改父窗口控件属性
window.parent.document.getElementById('frmright').src=window.parent.document.getElementById('frmrightsrc').value;
调用父窗口函数
window.parent.POPUP('bigFram');
父窗口调用iframe子窗口方法
<iframe name="myFrame" src="child.html"></iframe>
myFrame.window.functionName();
iframe子窗口调用父窗口方法
parent.functionName();
////////////////////////////////////
用js互相调用iframe页面内的js函数
一个html页面,分成左右两块,左边为导航栏,右边为需要显示的内容,代码如下:
左栏的代码为:
<IFRAME frameBorder=0 id=frmTitleLeft name=framLeft src="left.html" >
连接到left.html
比如右栏中有一个函数right(),我要在左栏的链接中调用right()函数,该如何实现呢
1,首先leftframe是内嵌在容器页index.html中的,因此需要先返回到index这一级别,并取得rightframe对象
var frames=window.parent.window.document.getElementById("frameid");
2,要能执行其页面中的函数,必须要获得window对象,这里有一个重要的对象contentWindow,获得这个对象,即可执行其中的函数了,如
frames.contentWindow.right();
以上代码兼容IE6,Firefox3,chrome2.0,均成功通过测试,IE7没试过,不过应该没问题。
3.例如:
window.parent.document.getElementById('leftFrame').contentWindow.JSMenu('MenuUl'+Sid);
window.parent.frames["leftFrame"].JSMenu('MenuUl'+Sid);
////////////////////////////////////////
还有下面一种,没测试过
并不是象通常那样iframeName.test();——test()为iframe里的方法。因为要写一个通用一点的东西,所以是从一个配置文件中动态获取到iframe的id。然后调用里面的方法。可是不成功。相烦帮忙看一看。代码如下:
<iframe id="iframe1"></iframe>
var cs = document.all;
for(var i = 0; i < cs.length; i++) {
if(cs.tagName.toUpperCase() == "IFRAME") {
if(cs.id == "iframe1") {
alert(frmDealData);
alert(cs);
document.frames.iframe1.setScreenletStatus(iframeLayoutLvl);
document.frames.cs.setScreenletStatus(iframeLayoutLvl);
}
}
}
第一句调用是成功的。
可第二句就不成功。
如果在只能取得cs对象的情况下,该怎么调用iframe里的方法?谢谢
------------------------------------
不要用id,用name
window.frames[cs].fun()
iframe子页面与父页面元素的访问以及js变量的访问的更多相关文章
- html中iframe子页面与父页面元素的访问以及js变量的访问
1.子页面访问父页面元素 parent.document.getElementById('id')和document相关的方法都可以这样用 2.父页面访问子页面元素 document.ge ...
- iframe子页面与父页面元素的访问以及js变量的访问[zhuan]
https://www.cnblogs.com/Capricorn-HCL/articles/4216302.html
- js之iframe子页面与父页面通信
iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...
- JS中iframe子页面与父页面之间通信
iframe子页面与父页面通信根据iframe中src属性是同域链接还是跨域链接,通信方式也不同. 一.同域下父子页面的通信 父页面parent.html <html> <head& ...
- 嵌入式iframe子页面与父页面js通信方式
iframe框架中的页面与主页面之间的通信方式根据iframe中src属性是同域链接还是跨域链接,有明显不同的通信方式,同域下的数据交换和DOM元素互访就简单的多了,而跨域的则需要一些巧妙的方式来实现 ...
- ifream子页面与父页面互调
function a1(x){ alert('父页面:' + x); } function acc(){ var frames = document.getElementById("dial ...
- jQuery中,子页面与父页面之间的调用方法
在jQuery中, 子页面查找父页面的元素 parent.$("#元素Id") 父页面调用子页面的元素 $("#子页面iframe的Id").contents( ...
- iframe子页面与父页面通信
同域下父子页面的通信 父页面: <!DOCTYPE html> <html> <head lang="en"> <meta charset ...
- html中 iframe子页面 与父页面之间的方法调用 ;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- java在cmd下编译引用第三方jar包
java在cmd下编译引用第三方jar包 转 https://blog.csdn.net/qq_21439971/article/details/53924594 获取第三方jar包 第三包我们可以引 ...
- Nginx模块 ngx_http_limit_req_module 限制请求速率
The ngx_http_limit_req_module module (0.7.21) is used to limit the request processing rate per a def ...
- using eclipse to write c programe
参考:http://developer.51cto.com/art/200906/126363.htm http://www.cnblogs.com/feisky/archive/2010/03/21 ...
- BZOJ.4598.[SDOI2016]模式字符串(点分治 Hash)
LOJ BZOJ 洛谷 点分治.考虑如何计算过\(rt\)的答案. 记\(pre[i]\)表示(之前的)子树内循环匹配了\(S\)的前缀\(i\)的路径有多少,\(suf[i]\)表示(之前的)子树内 ...
- BZOJ.2823.[AHOI2012]信号塔(最小圆覆盖 随机增量法)
BZOJ 洛谷 一个经典的随机增量法,具体可以看这里,只记一下大体流程. 一个定理:如果一个点\(p\)不在点集\(S\)的最小覆盖圆内,那么它一定在\(S\bigcup p\)的最小覆盖圆上. 所以 ...
- python 将list的值赋值给变量
list中有n个值,赋值给k个变量:a1, a2, ……,ak n = k时:a1, a2, ……,ak = list n > k时:使用1式报错:ValueError: too many va ...
- Python数据分析基础教程
Python数据分析基础教程(第2版)(高清版)PDF 百度网盘 链接:https://pan.baidu.com/s/1_FsReTBCaL_PzKhM0o6l0g 提取码:nkhw 复制这段内容后 ...
- [Code+#4]最短路 解题报告
Luogu · 传送门 Orz THU众大佬,lct(注意不是link-cut-tree,是一个大佬) 这道题很容易让人联想到 最短路,但是最短路需要先 建图: 暴力建出所有边的算法显然是不可行的,因 ...
- 输入、输出与Mad Libs 游戏
name1=input('请输入一个名字:') name2=input('再输入一个名字:') time1=input('请输入一段时间:') print('{},是傻子,{},{}找不到小栗旬'.f ...
- Ubuntu软件安装与卸载
ubuntu软件安装与卸载 更新Ubuntu软件下载地址 1. 寻找国内镜像源 所谓的镜像源:可以理解为提供下载软件的地方,比如Android手机上可以下载软件的91手机助手:iOS手机上可以下载软件 ...