複数のテキストフォームに対しての出力

javascriptを勉強中であり、至らぬ点があるかと思いますが質問させてください。


あるhtmlページに複数のテキストフォームがあり、そこにjavascript で for 文を使い
定型文の後に追番を付加したテキストを出力（表示）させたいと思っています。
個別のテキストフォームには出力ができるのですが、複数の指定となると
イマイチわかりませんでした…　（正しく動作しませんでした）

私の記述が悪いとは思いますが、どのように記述すればよいでしょうか？
知見をお借りできればと思います。
よろしくお願いいたします。


【希望】

サンプル1　　テスト1
サンプル2　　テスト2
サンプル3　　テスト3

上記


ちなみに以下が抜粋構文です。

【html】

<input type="button" value="テストボタン" onclick="myTest()">　　　←ここを押すとプログラム

-省略-

<form name="myForm1">
サンプル1　 <input type="text" size="30" name="form1" value="" readonly><br>
サンプル2　 <input type="text" size="30" name="form2" value="" readonly><br>
サンプル3　 <input type="text" size="30" name="form3" value="" readonly><br>
<input type="reset" value="クリア">
</form>


【javascript】

function myTest() {
for (num = 1; num <=3; num++) {
//document.myForm1.form1.value = "テスト" + num ;　だったら表示できる
document.myForm1.form[num].value = "テスト" + num ;
}
}

※「form[num]」の部分が悪いとは思っていますが…

No.1 ベストアンサー 回答者： t_ohta 回答日時： 2011/05/31 10:44

<script>

function myTest() {
for (num = 1; num <=3; num++) {
eval('document.myForm1.form' + num + '.value = "テスト' + num + '"');
}
}
</script>

この回答へのお礼

返事が遅れて申し訳ありません。
動作を確認することができました。
ありがとうございました！

お礼日時：2011/06/03 10:03

No.2 回答者： babu_baboo 回答日時： 2011/05/31 11:15

eval() って、きけんな、か・お・り!!

function myTest() {
　var form = document.forms['myForm1'];
　var elements = form.elements;

　for (var i = 1; i <= 3; i++)
　　elements['form' + i].value = "テスト" + i;
}


function myTest2 () {
　Array.prototype.forEach.call (
　　document.querySelectorAll ('form[name="myForm1"] input[type="text"][name^="form"]'),
　　　function (e, i) { e.value = 'テスト' + (i + 1)});
}

この回答へのお礼

回答ありがとうございました。
「eval()」って危険なんですか？
私の知識が不足おりまして…


私の知識不足で申し訳ありませんが、No.1の方をべストアンサーにさせていただきます。
本当にすいません。
これを機にいただいた回答から知識を深めたいと思います。

お礼日時：2011/06/03 10:07