DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> JS父頁面與子頁面相互傳值方法
JS父頁面與子頁面相互傳值方法
編輯:JavaScript綜合知識     

 這篇文章主要介紹了使用JS在父頁面和子頁面間相互傳值方法,子頁面可以是window.open彈出的,也可以是iframe框架中的頁面,需要的朋友可以參考下

一、子頁面是父頁面通過window.open彈出的情況 子頁面要向父頁面傳值,只要在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>無標題文檔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>無標題文檔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框架中的頁面情況   子頁面要向父頁面傳值,只要在document前面加parent即可。  1.父頁面代碼:   <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無標題文檔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>無標題文檔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>
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved