最近經(jīng)常用到iframe,,用的最多的就是在子頁面中操作父頁面的方法或變量等,,總結(jié)了用到的幾種方法,如下:
var tableName = window.parent.frames["mainFrame"].tName;//獲取父頁面的參數(shù)值 window.parent.frames["mainFrame"].getPageInfo();//父頁面的方法 var divValue = window.parent.$("#test").text(); (jQuery); //獲取父頁面div的文本值 var htmlUrl = window.parent.$("#main_frame").attr("src");(jQuery)//獲取父頁面的iframe的src屬性值
其實(shí)獲取父頁面的一個(gè)參數(shù)或方法有很多種的寫法,,現(xiàn)在拿獲取父頁面的iframe的src屬性值為例,現(xiàn)在先看主頁面的html代碼:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="index.aspx.cs" Inherits="index" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www./1999/xhtml"> <head runat="server"> <title>首頁</title> <link href="css/baseStyle.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" type="text/css" href="css/layout-default-latest.css"/> <link href="css/main.css" rel="stylesheet" type="text/css" /> <link href="css/jquery.treeview.css" rel="stylesheet" type="text/css"/> <script type="text/javascript" src="js/jquery-1.4.4.js"></script> <script type="text/javascript" src="js/jquery.treeview.js"></script> <script type="text/javascript" src="js/jquery.layout.js"></script> <script src="tuodongdiv/easydrag.js" type="text/javascript"></script> <script src="tuodongdiv/comm_window.js" type="text/javascript"></script> <style type="text/css"> body { font-size: 14px; font-family: 微軟雅黑; } #header { width:100%; border: #5e96d3 solid 1px; padding:0px; margin:0px; background-image:url(css/images/header_bg.gif); } .ui-layout-west{ padding: 0px; overflow: hidden; border: #5e96d3 solid 1px; } .ui-layout-north { padding-top:2px; padding: auto 20px; overflow: hidden; /*background: #e6e6e6 url(css/images/header_bg.gif) 0 50% repeat-x;*/ } .ui-layout-south { /* padding:auto 20px; overflow: hidden;*/ background: #e6e6e6 url(css/images/footer_bg.gif) 0 50% repeat-x; } #header a { float:right; margin-top:20px; margin-right:35px; } .ui-layout-center { /*padding:10px; */ } </style> <script type="text/javascript"> $(document).ready(function () { //樹形菜單 $("#browser").treeview(); $("body").layout({ north: { size: 60, resizable: false }, west: { }, south: { size: 20, resizable: false } }); }); </script> </head> <body> <!-- 頁面標(biāo)題 --> <div id="header" class="ui-layout-north"><img src="css/images/logo.png" alt="logo" style="float:left"/> <a href="index.aspx">主頁</a> </div> <!-- 菜單欄 --> <div class="ui-layout-west"> <ul id="browser" class="filetree"> <li><span class="folder">日志管理</span> <ul> <li><span class="file"><a href="LogInfo.aspx" target="mainFrame">日志查看</a></span></li> </ul> </li> <li><span class="folder">菜單一</span> <ul> <li><span class="folder">二級菜單</span> <ul id="folder21"> <li><span class="file"><a href="LogInfoCopy.aspx" target="mainFrame">日志查看副本</a></span></li> <li><span class="file"><a href="tuodongdiv/HTMLPage2.htm" target="mainFrame">測試彈出層</a></span></li> </ul> </li> <li><span class="file">二級菜單</span></li> </ul> </li> <li class="closed"><span class="folder">菜單二</span> <ul> <li><span class="file">二級菜單</span></li> </ul> </li> <li><span class="file">菜單三</span></li> </ul> </div> <!-- 內(nèi)容區(qū) --> <iframe id="main_frame" name="mainFrame" class="ui-layout-center" width="100%" height="100%" frameborder="0" scrolling="auto" src="MainFrame.aspx"></iframe>
<div class="ui-layout-south"> </div> </body> </html>
要獲取iframe的src的值的話,可以在子頁面MainFrame.aspx中用這幾種方法獲?。?/P>
var htmlUrl = window.parent.$("#main_frame").attr("src"); (jQuery)//獲取父頁面的iframe的src屬性值 var htmlUrl = window.parent.$("#main_frame").attr("src");(jQuery) var htmlUrl = window.parent.$("iframe[name='mainFrame']").attr("src");(jQuery) var htmlUrl = window.parent.document.getElementById("main_frame").src; var htmlUrl = window.parent.frames["mainFrame"].location; var htmlUrl = window.parent.$("[name='mainFrame']").attr("src");
這是自己用到的,應(yīng)該還會有很多的方法,,ok先這樣吧,。
|