First, the simplest is the data transfer of forms in the same web page.
For example, there are two forms on a web page, each with a text box and a button. Click the buttons to operate the value of each other's text box. The example we gave is to pay one text box to another text box. The specific HTML code is as follows:
<html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <body> <form name="form1" method="post" action=""> <input type="text" name="textfield"> <input type="button" name="Submit" value="1--------->2" onClick="ok()"> </form> <form name="form2" method="post" action=""> <input type="text" name="textfield2"> <input type="button" name="Submit" value="2----->1" onClick="ok1()"> </form> </body> </html>
The above is the HTMl code. You may have noticed the onclik code. There are two functions. Next is the JAVASCRIPT code:
<script language="JavaScript">
function ok()
{
document.form2.textfield2.value=document.form1.textfield.value;
}
function ok1()
{
document.form1.textfield.value=document.form2.textfield2.value;
}
</script>Second, The second is data transfer between the text boxes of the form between the two windows. In fact, this can be expanded on the original basis. Regarding how to create a pop-up window and the code of the form in the form, I won’t go into details here. Now let’s talk about how to operate the data of the text box in the form of the parent window. The specific code is as follows:
<script language="JavaScript">
function ok()
{
opener.document.form2.textfield2.value=document.form1.textfield.value
}
</script>Third, the third is to transfer data between the text boxes of the form between the frame web pages.
The thing to note is the way the frame is written:
<frameset cols="505,505"> <frame src="test.htm" name="leftr" id="leftr">//定义框架的名称 <frame src="test2.htm" id="right" name="right"> </frameset> <noframes><body> </body></noframes>
Specific The implementation code is as follows:
<script language="JavaScript">
function ok()
{
parent.leftr.document.form2.textfield2.value
=document.form1.textfield.value
}
</script>A simple method for interoperating the text box values between these three types of windows has been implemented. The other thing that needs attention is the relationship between them.
The above is the detailed content of How to implement data transfer between several forms in Javascript?. For more information, please follow other related articles on the PHP Chinese website!
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
