js實(shí)現(xiàn)iframe跨頁(yè)面調(diào)用函數(shù)的方法
本文實(shí)例講述了js實(shí)現(xiàn)iframe跨頁(yè)面調(diào)用函數(shù)的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
在項(xiàng)目中難免會(huì)遇到這樣一個(gè)問(wèn)題就是頁(yè)面引入了IFrame并且需要父頁(yè)面調(diào)用子頁(yè)面函數(shù)或者子頁(yè)面需要調(diào)用父頁(yè)面函數(shù)。比如說(shuō)：現(xiàn)在有兩個(gè)頁(yè)面parent.html和child.html。其中parent.html中含有IFrame并且IFrame指向child.html?，F(xiàn)在需要在parent.html/child.html中調(diào)用child.html/parent.html的一個(gè)js方法。
具體的代碼實(shí)現(xiàn)如下：
parent.html父頁(yè)面：
<head>
<script type="text/javascript">
function parent_click(){
alert("來(lái)自父頁(yè)面");
}
</script>
</head>
<body>
<input type="button" value="調(diào)用本頁(yè)面函數(shù)" onclick="parent_click();" />
<input type="button" value="調(diào)用子頁(yè)面函數(shù)" onclick='window.frames["childPage"].child_click();' />
<iframe id="childPage" name="childPage" src="inner.html" width="100%" frameborder="0"></iframe>
</body>
</html>
child.html子頁(yè)面：
<head>
<script type="text/javascript">
function child_click(){
alert("調(diào)用的子頁(yè)面函數(shù)");
}
</script>
</head>
<body>
<input type="button" value="調(diào)用父頁(yè)面函數(shù)" onclick='parent.window.parent_click();' />
<input type="button" value="調(diào)用本頁(yè)面函數(shù)" onclick="child_click();" />
</body>
</html>
希望本文所述對(duì)大家基于javascript的web程序設(shè)計(jì)有所幫助。
相關(guān)文章
Javascript 強(qiáng)制類型轉(zhuǎn)換函數(shù)
javascript是弱類型的語(yǔ)言，所以強(qiáng)制類型轉(zhuǎn)換還是比較重要的，下面看一下它的幾個(gè)強(qiáng)制轉(zhuǎn)換的函數(shù)2009-05-05
解決前后端交互數(shù)據(jù)出現(xiàn)精度丟失的多種方式
這篇文章主要為大家介紹了解決前后端交互數(shù)據(jù)出現(xiàn)精度丟失的多種方式，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-04-04
JavaScript創(chuàng)建數(shù)組的方法詳解
這篇文章主要為大家介紹了JavaScript創(chuàng)建數(shù)組的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助2021-12-12![淺談js對(duì)象屬性 通過(guò)點(diǎn)(.) 和方括號(hào)([]) 的不同之處](http://img.jbzj.com/images/xgimg/bcimg3.png)
淺談js對(duì)象屬性 通過(guò)點(diǎn)(.) 和方括號(hào)([]) 的不同之處
下面小編就為大家?guī)?lái)一篇淺談js對(duì)象屬性 通過(guò)點(diǎn)(.) 和方括號(hào)([]) 的不同之處。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10
在一個(gè)瀏覽器里呈現(xiàn)所有瀏覽器測(cè)試結(jié)果的前端測(cè)試工具的思路
對(duì)前端工程師來(lái)說(shuō),跨瀏覽器的兼容性問(wèn)題一直是最頭疼的,測(cè)試一個(gè)小小的東西,就要打開N個(gè)瀏覽器,然后比較來(lái)比較去,記錄個(gè)瀏覽器的數(shù)據(jù),比較不同,實(shí)在是麻煩.2010-03-03
JavaScript的setAttribute兼容性問(wèn)題解決方法
JavaScript的setAttribute存在兼容性問(wèn)題，下面與大家分享下具體的解決方法，感興趣的朋友可以參考下2013-11-11
javascript 關(guān)鍵字高亮顯示實(shí)現(xiàn)代碼
屏蔽HTML標(biāo)簽，支持多關(guān)鍵字（以空格間隔），關(guān)鍵字內(nèi)可含有特殊字符2010-09-09
本文給大家分享的常用腳本有通過(guò)數(shù)組，拓展字符串拼接容易導(dǎo)致性能的問(wèn)題、頁(yè)面 視口 滾動(dòng)條的位置的輔助函數(shù)、調(diào)節(jié)元素透明度的函數(shù)、獲取鼠標(biāo)位置的幾個(gè)通用的函數(shù)、使用cssdisplay屬性來(lái)切換元素可見性的一組函數(shù)、樣式相關(guān)的通用函數(shù)、獲取元素當(dāng)前的高度和寬度。2015-03-03
使用KrpanoToolJS在瀏覽器切圖的實(shí)例詳解
這篇文章主要介紹了使用KrpanoToolJS在瀏覽器切圖的實(shí)例詳解,大概是需要在瀏覽器中將全景圖轉(zhuǎn)為立方體圖、多層級(jí)瓦片圖，通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-10-10
js showModalDialog參數(shù)的使用詳解
本篇文章主要是對(duì)js中showModalDialog參數(shù)的使用進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-01-01