js控制Iframe 和 iframe与主页的交互，传值 (转载)
HTML框架IFrame下利用JS在主頁面和子頁面間傳值
?
今天寫的程序涉及到JS框架傳值的問題,這些是我找到的一些資料
?
下面主頁面和子頁面互相傳值的DEMO?如果僅僅需要子頁面觸發(fā)主頁面的函數(shù)?僅需?[?parent.window.你的函數(shù)?]?就可以了
?
DOM方法：
父窗口操作IFRAME：window.frames["iframeSon"].document
IFRAME操作父窗口:?window.parent.document
jquery方法:
在父窗口中操作?選中IFRAME中的所有輸入框：?$(window.frames["iframeSon"].document).find(”:text”);
在IFRAME中操作?選中父窗口中的所有輸入框：$(window.parent.document).find(”:text”);
iframe框架的HTML：<iframe?src=”test.html”?id=”iframeSon”?width=”700″?height=”300″?frameborder=”0″?scrolling=”auto”></iframe>
細心的朋友一下就能理解，原理其實很簡單，就是用到了$(DOM對象)轉(zhuǎn)換成jquery對象。
例子：
主頁面
<title>主頁面</title>
<script?type="text/javascript"?src="css_js/jquery/jquery-1.3.2.min.js"></script>
<script?type="text/javascript">
function?showSubValue(){
//var?v?=?window.frames[0].document.getElementById("subdiv1").innerHTML;
//alert(v);
// ??http://hi.baidu.com/bigideaer/blog/item/780337e6af39933d2df534ff.html
var?o?=?$(window.frames[0].document).find(":div#subdiv1");
alert(o.html());
}
</script>
</head>
<body>
<div?id="mainDiv">主頁面測試數(shù)據(jù)</div>
<input?type="button"?value="查看子頁面數(shù)據(jù)"?οnclick="showSubValue();"/>
<iframe?src="sub.html"?width="300"?height="300"></iframe>
</body>?
</html>
子頁面：
<script?type="text/javascript"?src="css_js/jquery/jquery-1.3.2.min.js"></script>
<title>子頁面</title>
<script?type="text/javascript">
function?showMainValue(){
//dom方式
//var?v?=?window.parent.document.getElementById("mainDiv").innerHTML;
//alert(v);
//window.parent.document.getElementById("mainDiv").innerHTML?=?"修改后的主頁面數(shù)據(jù)";
//jquery方式
var?o?=?$(window.parent.document).find(":div#mainDiv");
alert(o.html());
}
</script>
</head>
<body>
<div?id="subdiv1">子頁面測試數(shù)據(jù)</div>
<input?type="button"?value="顯示父頁面數(shù)據(jù)"?οnclick="showMainValue();"/>
</body>
</html>
總結(jié)
以上是生活随笔為你收集整理的js控制Iframe 和 iframe与主页的交互，传值 (转载)的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： HTML IFRAME 用法小总结
- 下一篇： HTML form 标签的 action