jquery操作iframe實(shí)現(xiàn)父頁面和子頁面相互操作的九種情況
現(xiàn)實(shí)開發(fā)中難免會(huì)遇到子頁面、父頁面相互操作的情況,由于時(shí)不時(shí)地會(huì)遇到幾次(不是一次),所以就整理了一下父子頁面相互相互調(diào)用常見的九種情況,作為自己的備忘錄,同時(shí)也希望對大家有幫助。
一、子頁面C1操作父頁面P(下述三個(gè)方法寫在子頁面C1中)
//獲取父頁面P中控件的值, btnParent1是子頁面C1中的按鈕 $("#btnParent1").click(function () { var pageId = $("#pageId", parent.document).val(); alert("父頁面的pageId=" + pageId); }); //調(diào)用父頁面P中的方法, btnParent2是子頁面C1中的按鈕 $("#btnParent2").click(function () { parent.HomeRun(); }); //觸發(fā)父頁面P中按鈕的點(diǎn)擊事件, btnParent3是子頁面C1中的按鈕 $("#btnParent3").click(function () { $("#btnShow", parent.document).click(); });
二、子頁面C1操作兄弟頁面C2(下述三個(gè)方法寫在子頁面C1中)
//獲取兄弟頁面C2中控件的值, btnSiblings1是子頁面C1中的按鈕 $("#btnSiblings1").click(function () { var sibling = parent.document.getElementById("Sys_UserManage_Index").contentWindow; var pageId = sibling.$("#pageId").val(); alert("兄弟頁面的pageId=" + pageId); }); //調(diào)用兄弟頁面C2中的方法, btnSiblings2是子頁面C1中的按鈕 $("#btnSiblings2").click(function () { var sibling = parent.document.getElementById("Sys_UserManage_Index").contentWindow; sibling.UserManageRun(); }); //觸發(fā)兄弟頁面C2中按鈕的點(diǎn)擊事件, btnSiblings3是子頁面C1中的按鈕 $("#btnSiblings3").click(function () { var sibling = parent.document.getElementById("Sys_UserManage_Index").contentWindow; var pageId = sibling.$("#btnShow").click(); });
三、父頁面P操作子頁面C1(下述三個(gè)方法寫在父頁面P中)
//獲取子頁面C1中控件的值, btnChild1是父頁面P中的按鈕 $("#btnChild1").click(function () { var child = $("#Sys_UserManage_Index").contents(); var pageId = child.find("#pageId").val(); alert("子頁面的pageId=" + pageId); }); //調(diào)用子頁面C1中的方法, btnChild2是父頁面P中的按鈕 $("#btnChild2").click(function () { var child = $("#Sys_UserManage_Index")[0].contentWindow; child.UserManageRun(); }); //觸發(fā)子頁面C1中按鈕的點(diǎn)擊事件, btnChild3是父頁面P中的按鈕 $("#btnChild3").click(function () { var child = $("#Sys_UserManage_Index").contents(); child.find("#btnShow").click(); });
到此這篇關(guān)于jquery操作iframe實(shí)現(xiàn)父頁面和子頁面相互操作的九種情況的文章就介紹到這了,更多相關(guān)jquery 父頁面和子頁面相互操作內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
jQuery實(shí)現(xiàn)點(diǎn)擊自身以外區(qū)域關(guān)閉彈出層功能完整示例【改進(jìn)版】
這篇文章主要介紹了jQuery實(shí)現(xiàn)點(diǎn)擊自身以外區(qū)域關(guān)閉彈出層功能,結(jié)合具體實(shí)例形式分析了jQuery事件響應(yīng)及頁面元素屬性動(dòng)態(tài)操作實(shí)現(xiàn)彈出層打開與關(guān)閉相關(guān)操作技巧,需要的朋友可以參考下2018-07-07jQuery中closest()函數(shù)用法實(shí)例
這篇文章主要介紹了jQuery中closest()函數(shù)用法,實(shí)例分析了closest()函數(shù)的功能、定義及匹配元素的各種技巧,需要的朋友可以參考下2015-01-01jQuery實(shí)現(xiàn)消息滾動(dòng)播放效果
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)消息滾動(dòng)播放效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-02-02動(dòng)態(tài)獲取復(fù)選框checkbox選中個(gè)數(shù)的jquery代碼
這篇文章主要介紹了jquery中動(dòng)態(tài)獲取復(fù)選框checkbox選中的個(gè)數(shù)的實(shí)現(xiàn)代碼,需要的朋友可以參考下2013-06-06鋒利的jQuery 要點(diǎn)歸納(三) jQuery中的事件和動(dòng)畫(下:動(dòng)畫篇)
《鋒利的jQuery》要點(diǎn)歸納(三) jQuery中的事件和動(dòng)畫(下:動(dòng)畫篇)2010-03-03jQuery實(shí)現(xiàn)定時(shí)隱藏對話框的方法分析
這篇文章主要介紹了jQuery實(shí)現(xiàn)定時(shí)隱藏對話框的方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery定時(shí)隱藏對話框的相關(guān)函數(shù)、實(shí)現(xiàn)方法與操作注意事項(xiàng),需要的朋友可以參考下2018-02-02jQury Ajax使用Token驗(yàn)證身份實(shí)例代碼
這篇文章主要介紹了jQury Ajax使用Token驗(yàn)證身份實(shí)例代碼,需要的朋友可以參考下2017-09-09autoIMG 基于jquery的圖片自適應(yīng)插件代碼
為了防止圖片撐破布局,最常見的仍然是通過onload后獲取圖片尺寸再進(jìn)行調(diào)整,所以加載過程中仍然會(huì)撐破。2011-03-03