Javascript で複数のフォーム間のデータ転送を実装するにはどうすればよいですか?-jsチュートリアル-php.cn

Javascript で複数のフォーム間のデータ転送を実装するにはどうすればよいですか?

伊谢尔伦

リリース： 2017-07-18 15:13:24

オリジナル

1603 人が閲覧しました

まず、最も簡単なのは、同じ Web ページ内のフォームからデータを転送することです。

たとえば、Web ページ上に 2 つのフォームがあり、それぞれにテキストボックスとボタンがあります。ボタンをクリックしてお互いのテキストボックスの値を操作します。私たちが挙げた例は、あるテキストボックスを別のテキストボックスに支払うことです。具体的な HTML コードは次のとおりです:

<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>

ログイン後にコピー

上記は HTMl コードです。onclik コードが 2 つあることに気づいたかもしれません。次は JAVASCRIPT コードです:

<script language="JavaScript"> 
function ok() 
{ 
document.form2.textfield2.value=document.form1.textfield.value; 
} 
function ok1() 
{ 
document.form1.textfield.value=document.form2.textfield2.value; 
} 
</script>

ログイン後にコピー

2 つ目は 2 つのウィンドウの間にあります。フォーム内のテキストボックス間でデータを転送します。実際、これは元のベースに基づいて拡張できます。ポップアップウィンドウの作成方法とフォーム内のフォームのコードについてはここでは詳しく説明しません。次に、親ウィンドウのフォームでテキストボックスのデータを操作する方法について説明します。具体的なコードは次のとおりです。

<script language="JavaScript"> 
function ok() 
{ 
opener.document.form2.textfield2.value=document.form1.textfield.value 
} 
</script>

ログイン後にコピー

3 つ目は、フレーム Web ページ間のフォームのテキストボックス間でデータを転送することです。
注目すべきは、フレームの記述方法です。実装コードは次のとおりです:

<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>

ログイン後にコピー

これら 3 つのウィンドウ間でテキストボックスの値を相互運用するための簡単なメソッドが実装されています。もう 1 つ注意が必要なのは、それらの間の関係です。

以上がJavascript で複数のフォーム間のデータ転送を実装するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。