iframe的使用小贴士

1.以前又说到“根据内容计算iframe的高度”html

  连接服务器

2.如今想说的是,通常iframe页面都是嵌套在父页面当中,因此在通常在iframe里面作相关动做时默认都是iframe页面的,不会影响到父页面。所以如果须要在iframe的子页面里面操做父页面的元素,咱们会如何作?dom

iframe 子页面操做父页面元素须要知道的两点是:spa

(1)iframe 子页面和父页面必须属于同一个域下。(这个问题,通常在本地页面来作到,是不太可能的,常常会有这个错误出现 “Uncaught SecurityError: Blocked a frame with origin "null" from accessing a frame with origin "null". Protocols, domains, and ports must match.”,故而通常的解决方案是放在服务器上去访问。 ).net

 

(2)iframe 页面获取父页面的对象方法是 parentcode

例如:iframe 子页面获取父页面的id为mask的对象:$("#mask",parent.document)htm

$("#mask",parent.document).html() --------- id=mask的html内容对象

同理能够找到其余类型的对象blog

 

其次,就是父页面获取iframe子页面中的对象:$(window.frames["framename"].document).find("#id")  或者    $("#iframeid").contents().find("#id");get

例如:$(window.frames["mainframe"].document).find("#mask2"); 中括号中的是iframe的名字,find后面则是对象的id。

详见连接:http://blog.csdn.net/zalion/article/details/5894103

 

3.使用iframe时,如何正确使用,通常使用iframe时,也是会有须要经过a标签切换的

例如:

 <ul class="nav nav-list">
                <li class="active parent_li"><a href="BSwelcome.aspx" target="mainframe"></li>
                <li class="parent_li"><a href="MyContacts/MyInfoAssitant/BSMyInfoList.aspx?jb_id=&grade=all&&paixu=no&regs=dd&cup=1" target="mainframe"></a></li>
                <li class="parent_li"><a href="MyContacts/MyOrder/BSMyOrderList.aspx?cup=1&&sel=no" target="mainframe"></a></li>
                <li class="parent_li"><a href="MyContacts/SubmitOrder/BSSubmitOrderList.aspx?cup=1" target="mainframe"></a></li>
 </ul>
 <iframe id="ifrma1" src="BSwelcome.aspx" name="mainframe" frameborder="no" scrolling="yes"
                style="width: 100%; height: 100%;"></iframe>

通常iframe要有id值,name值,而a标签连接了地址,还要多一句 target="mainframe"  而mainframe就是iframe的name值。才不至于点击a标签直接跳过去。

相关文章
相关标签/搜索