以下のソースを利用してホームページにテキストボックスに入力した値を取得し、表示させる機能を複数付けたいのですが、うまく実装できません。
同一ページ内に複数実装するやり方についてアドバイスをお願いします。
よろしくお願いします。
HTML
1 <html> 2 <head> 3 <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> 4 <META http-equiv="Content-Style-Type" content="text/css"> 5 <title></title> 6 7 <script type="text/javascript" language="javascript"> 8 function onButtonClick() { 9 target = document.getElementById("output"); 10 target.innerText = document.forms.form1.textBox1.value; 11 } 12 </script> 13 </head> 14 <body> 15 <form name="form1" action=""> 16 <input name="textBox1" type="text" value="" /> 17 <input type="button" value="OK!" onclick="onButtonClick();" /> 18 </form> 19 <hr /> 20 <div id="output"></div> 21 </body> 22 </html>
以下の様にしましたが、上手くいきませんでした。
HTML
1 <html> 2 <head> 3 <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> 4 <META http-equiv="Content-Style-Type" content="text/css"> 5 <title></title> 6 7 <script type="text/javascript" language="javascript"> 8 function onButtonClick() { 9 target = document.getElementById("output1"); 10 target.innerText = document.forms.form1.textBox1.value; 11 } 12 </script> 13 <script type="text/javascript" language="javascript"> 14 function onButtonClick() { 15 target = document.getElementById("output2"); 16 target.innerText = document.forms.form2.textBox2.value; 17 } 18 </script> 19 </head> 20 <body> 21 <form name="form1" action=""> 22 <input name="textBox1" type="text" value="" /> 23 <input type="button" value="OK!" onclick="onButtonClick();" /> 24 </form> 25 <form name="form2" action=""> 26 <input name="textBox2" type="text" value="" /> 27 <input type="button" value="OK!" onclick="onButtonClick();" /> 28 </form> 29 <hr /> 30 <div id="output1"></div> 31 <div id="output2"></div> 32 </body> 33 </html>
質問にソースを記述する場合はマークダウン機能を使ってくださいね。
回答1件
あなたの回答
tips
プレビュー