|
最近經(jīng)常用到iframe，用的最多的就是在子頁(yè)面中操作父頁(yè)面的方法或變量等，總結(jié)了用到的幾種方法，如下：
var tableName = window.parent.frames["mainFrame"].tName;//獲取父頁(yè)面的參數(shù)值
window.parent.frames["mainFrame"].getPageInfo();//父頁(yè)面的方法
var divValue = window.parent.$("#test").text(); (jQuery); //獲取父頁(yè)面div的文本值
var htmlUrl = window.parent.$("#main_frame").attr("src");(jQuery)//獲取父頁(yè)面的iframe的src屬性值
其實(shí)獲取父頁(yè)面的一個(gè)參數(shù)或方法有很多種的寫法，現(xiàn)在拿獲取父頁(yè)面的iframe的src屬性值為例，現(xiàn)在先看主頁(yè)面的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>首頁(yè)</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>
<!-- 頁(yè)面標(biāo)題 -->
<div id="header" class="ui-layout-north"><img src="css/images/logo.png" alt="logo" style="float:left"/>
<a href="index.aspx">主頁(yè)</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">二級(jí)菜單</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">測(cè)試彈出層</a></span></li>
</ul>
</li>
<li><span class="file">二級(jí)菜單</span></li>
</ul>
</li>
<li class="closed"><span class="folder">菜單二</span>
<ul>
<li><span class="file">二級(jí)菜單</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的值的話，可以在子頁(yè)面MainFrame.aspx中用這幾種方法獲?。?/P>
var htmlUrl = window.parent.$("#main_frame").attr("src"); (jQuery)//獲取父頁(yè)面的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)該還會(huì)有很多的方法，ok先這樣吧。
|
