JS父頁面與子頁面相互傳值方法
一、子頁面是父頁面通過window.open彈出的情況
子頁面要向父頁面?zhèn)髦?,只要在document前面加window.opener即可。
如:
1.父頁面代碼:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔title>
head>
<script language="javascript">
function tanchu()
{
window.open("Untitled-5.html");
}
script>
<body>
<form id="form1" name="form1" method="post" action="">
<label> <input type="submit" name="button" id="button" value="提交"
onclick="tanchu()" />
label> <label> <input type="text" name="textfield" id="textfield" />
label>
form>
</body>
</html>
2.子頁面代碼:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔title>
head>
<script language="javascript">
function aaa()
{
window.opener.document.getElementByIdx('textfield').value='123123123';
}
script>
<body>
<form id="form1" name="form1" method="post" action="">
<label> <input type="submit" name="button" id="button" value="提交"
onclick="aaa()" />
label>
form>
</body>
</html>
二、子頁面是iframe框架中的頁面情況
子頁面要向父頁面?zhèn)髦?,只要在document前面加parent即可。
1.父頁面代碼:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔title>
head>
<body>
<form id="form1" name="form1" method="post" action="">
<label> <input type="text" name="textfield" id="textfield" />
label>
<iframe id="myiframe" src="Untitled-3.html">iframe>
form>
</body>
</html>
2.子頁面代碼
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無標(biāo)題文檔title>
head>
<script language="javascript">
function aa()
{
var a=parent.document.getElementByIdx('textfield').value;
alert(a);
}
script>
<body>
<form id="form1" name="form1" method="post" action="">
<label> <input type="submit" name="button" id="button" value="提交"
onClick="aa()" />
label>
form>
</body>
</html>
- JAVASCRIPT實(shí)現(xiàn)的WEB頁面跳轉(zhuǎn)以及頁面間傳值方法
- javascript靜態(tài)頁面?zhèn)髦档娜N方法分享
- javascript不同頁面?zhèn)髦档母倪M(jìn)版
- JS中Iframe之間傳值及子頁面與父頁面應(yīng)用
- ajax的json傳值方式在jsp頁面中的應(yīng)用
- JavaScript實(shí)現(xiàn)在頁面間傳值的方法
- 詳解vuejs幾種不同組件(頁面)間傳值的方式
- 靜態(tài)頁面html中跳轉(zhuǎn)傳值的JS處理技巧
- JSP頁面間的傳值方法總結(jié)
- JS實(shí)現(xiàn)頁面跳轉(zhuǎn)并傳值
相關(guān)文章
JavaScript代碼實(shí)現(xiàn)圖片循環(huán)滾動(dòng)效果
這篇文章主要介紹了JavaScript代碼實(shí)現(xiàn)圖片循環(huán)滾動(dòng)效果的相關(guān)資料,非常不錯(cuò),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2016-06-06JavaScript對象屬性檢查、增加、刪除、訪問操作實(shí)例
這篇文章主要介紹了JavaScript對象屬性檢查、增加、刪除、訪問操作實(shí)例,本文分別給出代碼實(shí)例來講解如何給對象增加屬性、檢查屬性存在、以及刪除和訪問屬性,需要的朋友可以參考下2015-07-07JavaScript和jQuery獲取input框的絕對位置實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄狫avaScript和jQuery獲取input框的絕對位置實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10Webpack框架核心概念(知識(shí)點(diǎn)整理)
webpack 是一個(gè)現(xiàn)代 JavaScript 應(yīng)用程序的模塊打包器(module bundler)。這篇文章主要介紹了Webpack框架核心概念(知識(shí)點(diǎn)整理),需要的朋友可以參考下2017-12-12html中通過JS獲取JSON數(shù)據(jù)并加載的方法
本篇內(nèi)容主要給大家講了如何通過javascript解析JSON并得到數(shù)據(jù)后添加到HTML中的方法,需要的朋友參考下。2017-11-11JS動(dòng)態(tài)計(jì)算移動(dòng)端rem的解決方案
移動(dòng)設(shè)備分辨率五花八門雖然我們可以通過CSS3的media query來實(shí)現(xiàn)適配,但是這種做法并不能適配所有設(shè)備,這篇文章主要介紹了js動(dòng)態(tài)計(jì)算移動(dòng)端rem的解決方案,非常不錯(cuò),感興趣的朋友一起看看吧2016-10-10ie 處理 gif動(dòng)畫 的onload 事件的一個(gè) bug
ie 處理 gif動(dòng)畫 的onload 事件的一個(gè) bug...2007-04-04uniapp與webview之間的相互傳值的實(shí)現(xiàn)
這篇文章主要介紹了uniapp與webview之間的相互傳值的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06JS中call和apply函數(shù)用法實(shí)例分析
這篇文章主要介紹了JS中call和apply函數(shù)用法,結(jié)合實(shí)例形式較為詳細(xì)的分析了call和apply函數(shù)繼承功能的使用方法、區(qū)別及操作注意事項(xiàng),需要的朋友可以參考下2018-06-06