jQuery實現(xiàn)iframe父窗體和子窗體的相互調用
本文實例講述了jQuery實現(xiàn)iframe父窗體和子窗體的相互調用方法。分享給大家供大家參考,具體如下:
父窗體
<html> <head> <title>usually function</title> </head> <body> <iframe src="http://www.baidu.com" ></iframe> <iframe src="myifame.html" id="name_iframe" name="name_iframe"></iframe> <button value="buttonvalue" id="testid">buttonvalue</button> </body> <html> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script> //contentWindow這個屬性,相當于獲取iframe網(wǎng)頁里面的window對象 $(function(){ //父窗體獲取子窗體的變量 alert(document.getElementById("name_iframe").contentWindow.vname);//父窗體獲取子窗體的方法 document.getElementById("name_iframe").contentWindow.test();//父窗體獲取子窗體的內容 alert(document.getElementById("name_iframe").contentWindow.document.body.outerHTML); }); var myname="hb"; function parentFunction(){ alert("parentFunction"); } </script>
子窗體
<html> <head> <title>usually function</title> </head> <body> <button onclick="getParentContent()">getParentContent</button> </body> <html> <script type="text/javascript" src="jquery-1.4.4.js"></script> <script> var vname="v_name"; function test(){ alert("function test"); } function getParentContent(){ //獲取父窗體的變量 alert(window.parent.myname); //獲取父窗體的方法 window.parent.parentFunction(); //獲取父窗體的dom節(jié)點 alert(parent.document.getElementById("testid").value); } </script>
更多關于jQuery相關內容感興趣的讀者可查看本站專題:《jQuery常用插件及用法總結》、《jquery中Ajax用法總結》、《jQuery表格(table)操作技巧匯總》、《jQuery拖拽特效與技巧總結》、《jQuery擴展技巧總結》、《jQuery常見經(jīng)典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。
- JQueryiframe頁面操作父頁面中的元素與方法(實例講解)
- jquery、js調用iframe父窗口與子窗口元素的方法整理
- js與jQuery 獲取父窗、子窗的iframe
- JQuery操作iframe父頁面與子頁面的元素與方法(實例講解)
- jquery 查找iframe父級頁面元素的實現(xiàn)代碼
- iframe里面的元素觸發(fā)父窗口元素事件的jquery代碼
- 使用jquery/js獲取iframe父子級、同級獲取元素的方法
- JQUERY 獲取IFrame中對象及獲取其父窗口中對象示例
- jQuery中彈出iframe內嵌頁面元素到父頁面并全屏化的實例代碼
- 利用JQuery操作iframe父頁面、子頁面的元素和方法匯總
相關文章
jQuery操作checkbox選擇(list/table)
本文將介紹下checkbox list選擇及checkbox table選中附效果圖,感興趣的朋友可以參考下哈,希望可以幫助到你2013-04-04jQuery插件原來如此簡單 jQuery插件的機制及實戰(zhàn)
這種插件是將對象方法封裝起來,用于對通過選擇器獲取的jQuery對象進行操作,是最常見的一種插件2012-02-02jquery實現(xiàn)ajax提交表單信息的簡單方法(推薦)
下面小編就為大家?guī)硪黄猨query實現(xiàn)ajax提交表單信息的簡單方法(推薦)。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-08-08