當(dāng)前位置：
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
JavaScript将iframe中控件的值传到主页面控件中
生活随笔
收集整理的這篇文章主要介紹了
JavaScript将iframe中控件的值传到主页面控件中
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
主要是通過(guò)在主頁(yè)面定義一個(gè)傳輸數(shù)據(jù)的函數(shù)GetData(data)，然后在iframe嵌入頁(yè)面中通過(guò)parent.GetData(data),這樣即可在GetData實(shí)現(xiàn)將data進(jìn)行處理即可。
現(xiàn)在來(lái)看一下代碼的實(shí)現(xiàn)，首先來(lái)看一個(gè)主界面的代碼
<html><head><script type="text/javascript">function GetData(data){alert(data);document.getElementById("id1").value=data;}</script></head> <body><div><input id="id1" type="text" value="11" /></div><div><iframe id="frameid" src="b.html"></iframe></div> </body> </html>?可以看到在主頁(yè)面定義一個(gè)JavaScript函數(shù)實(shí)現(xiàn)，將傳入的data參數(shù)，賦值給id為id1的input 文本控件。
下面來(lái)看一個(gè)嵌入的b.html頁(yè)面代碼
<script type="text/javascript">function OnTest(){var data=document.getElementById("test").value;parent.GetData(data);} </script> <div><input id="test" type="text" value="將此值傳到主頁(yè)面控件中" /><button οnclick="OnTest()">test</button> </div>?嵌入頁(yè)面中主要通過(guò)一個(gè)按鈕事件，將此頁(yè)面中一個(gè)input文本控件中的值取出，然后通過(guò)parent.GetData(data)調(diào)用主頁(yè)面的函數(shù)進(jìn)行操作即可。
這是未點(diǎn)擊按鈕前的效果，現(xiàn)在點(diǎn)擊按鈕查看效果。
這樣就實(shí)現(xiàn)了傳值的效果
?
總結(jié)
以上是生活随笔為你收集整理的JavaScript将iframe中控件的值传到主页面控件中的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： iOS.Dev.Support.Mult
- 下一篇： 【DevOps】从理念到实施