`
slbszq
  • 浏览: 264214 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

js访问iframe中的元素和方法,以及兼容性问题

阅读更多

全局变量

 
var abc;
abc = 3;  <==> window['abc'] = 3;

1.首先,如何访问iframe中的元素?见如下代码:
(1)1.htm源码:
<input  type=button value="test"  onclick="self.frames['a'].document.all.mybutton.disabled=true">  
<iframe  name='a'  src="2.htm" id="iframe2"></iframe>  
(2)2.htm源码
<input  type=button  value="mybutton"  id="mybutton">
<script language=javascript>
function showInfo(){alert();}
</script>
------------------------------------------------
self.frames['a'].document.all.mybutton.disabled 
self.frames['a'].funtionname(param) 
其中 ‘a’是iframe的name,mybutton是button的id。

------------------------------------------------
在1.htm中点击test按钮,可以使2.htm(iframe页面)中mybutton按钮失效.就这么简单,呵呵.如果要调用2.htm中的JS函数这样写:
self.frames['a'].funtionname(param)

在1.htm中调用2.htm中的JS函数:iframe2.showInfo();

 

 

2.我遇到的问题:做一个项目时按照上述方法却无法访问iframe中的元素!!代码就是拷贝过来改变量名得来的,怎么就是不行呢?
后来,发现一点本质的不同:我的iframe页用的不是站内的页面,是指向外站中的url的!
将外站页面存到本站内后,就可以了,呵呵!
也就是说对于iframe中的页,如果是外站的页面,本站是没有对它的控制权的,甚至页中元素也是无法读取访问的.

动态更改iframe的高度
function changeParent(){
            if (frameid1 != "" && parent!=null )

               parent.document.getElementById("frameid1").style.height=document.body.scrollHeight;                
            }

}

**********************************************************************

兼容性问题:

经测试上面方法在IE中都正常,但后来chrome浏览器升级后就无法访问iframe中的方法。

解决办法:

self.frames['a'].funtionname(param)

改为

self.frames['a'].contentWindow.funtionname(param)

**********************************************************************

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics