iframe获取子框架的值

来源:互联网 发布:数据的作用 编辑:程序博客网 时间:2024/06/04 20:07

iframe可以将网站各页面的公共部分(如导航等)提出来单独做一个页面,减少了代码的冗余。

但说实话,我个人并不喜欢使用这个,因为这个在调整样式的时候会比较麻烦——当然,有可能是我水平太菜的问题。不过现在有很多系统还是使用iframe,前几天在做公司一个项目的时候也遇到了,在获取子框架值上花了不少时间,现在做个总结,也希望能为大家以后节省点时间。

iframe有两种情况。

第一种:在页面中直接使用一个iframe,如图。


页面中这么引入iframe

<iframe src="...." name="ifarme" id="iframe"  width.....></iframe>

iframe页面中有如下代码

<form id="form1" name="form1" method="post" action=""><input type="text" id="sonText" name="sonText" /></form>

那么从父级页面取iframe值

function getvalue()  {   alert(iframe.form1.sonText.value); //iframe名.表单名.控件名.value   //也可以根据控件id来取值   var text = window.iframe.document.getElementById('sonText').value; //iframe为iframe标签的name值  }

iframe获取父级页面的值与上边相似:

window.parent.document.getElementById('标签ID').value;

第二种:一个页面中有多个iframe,iframe之间互相取值,如图。


在iframe2中获取ifame1的值如下:

window.parent.frames['iframe1'].sonText.value;//或window.parent.frames['iframe1'].document.getElementById('sonText').value;


原创粉丝点击