歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> JQuery 操作 Frame示例

JQuery 操作 Frame示例

日期:2017/3/1 11:00:10   编辑:Linux編程

一、多框架集合

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head runat="server">
  3. <title>設備***管理系統平台</title>
  4. </head>
  5. <frameset border="0" framespacing="0" rows="106,*,26" topmargin="0" leftmargin="0"
  6. marginheight="0" marginwidth="0">
  7. <frame name="TopFrm" src="Top.aspx" mce_src="Top.aspx" marginwidth="0" marginheight="0" border="0"
  8. frameborder="no" scrolling="no" topmargin="0" leftmargin="0" target="WelcomeFrm" />
  9. <frameset border="0" name="cen" framespacing="0" frameborder="0" cols="190,*" topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">
  10. <frame name="LeftFrm" src="left.aspx" mce_src="left.aspx" border="0" marginwidth="0" bordercolor="#000" marginheight="0" frameborder="0" scrolling="no" topmargin="0" leftmargin="0" target="main" noresize="noresize">
  11. <frameset border="0" framespacing="0" frameborder="no" cols="6,*">
  12. <frame name="ShowOrHide" src="ShowOrHidden.aspx" mce_src="ShowOrHidden.aspx" noresize="noresize" scrolling="no" />
  13. <frame name="WelcomeFrm" src="" border="0" frameborder="no" scrolling="yes" />
  14. </frameset>
  15. </frameset>
  16. <frame name="BottomStateFrm" src="BottomStateFrame.aspx" mce_src="BottomStateFrame.aspx" border="0" framespacing="1" frameborder="0" scrolling="No" noresize="noresize" id="bottomFrame" />
  17. </frameset>
  18. </html>

主頁面FrmIndex中有如下幾個框架:

二、多個Frame或Ifrme間選取

1、在主框架FrmIndex頁面選中LeftFrm中的所有a元素:

  1. $(window.frames['LeftFrm'].document).find('a').attr('href', 'www.baidu.com');
  2. 或者:
  3. $(window.LeftFrm.document).find('a').attr('href', 'www.baidu.com');//直接框架名稱

2、在框架LeftFrm頁面中操作主框架頁面所有元素a:

  1. $(window.parent.document).find('a').attr('href', 'www.baidu.com');

3、在TopFrm頁面中操作LeftFrm中的元素:

  1. $shortcutTab = $('table[id=tabMenuLevel2]', window.parent.LeftFrm.document);//parent.frames['LeftFrm'].$('table[id=tabMenuLevel2]');
  2. $('table[id=tabMenuLevel2]', window.parent.LeftFrm.document).append('<tr><td>hello ,TopFrm sets LeftFrm/'s Table element success! </td></tr>');

三、小結

在多個框架集中,有時不同框架間需要協同工作,涉及到元素間操作問題。寫本文的目的也正在於解決類似的問題。May be it's useful for u!

Copyright © Linux教程網 All Rights Reserved