テキストフィールドの数値の合計を出す


動作ブラウザ 【 IE:3.0  NN:2.0
Internet Explorer Netscape Navigator DreamPassport iCab
3.0x 4.0x 4.5 5.0x 5.5 2.0x 3.0x 4.0x 4.x 6.0 2 3 2.x
Windows - - -
Macintosh - - -
UNIX - - - - - - - -
Dreamcast - - - - - - - - - - -

ポイント n = 0; for (i=0; i<5; i++) n += eval(document.myFORM.elements[i].value);
説  明 複数のテキストフィールドを読み出すには「document.フォーム名.elements[参照番号].value」とします。参照番号は最初のテキストフィールドが0番、以後1、2、3...と連番になります。for命令を使ってテキストフィールドの数だけ参照番号を変えて値を読み出し加算していきます。
サンプル <html> <head> <title>テキストフィールドの数値の合計を出す</title> <script Language="JavaScript"><!-- function calc() { n = 0; for (i=0; i<5; i++) n += eval(document.myFORM.elements[i].value); alert("合計は"+n+"です"); } // --></script> </head> <body> <form name="myFORM"> 数値1:<input type="text"><br> 数値2:<input type="text"><br> 数値3:<input type="text"><br> 数値4:<input type="text"><br> 数値5:<input type="text"><br> <input type="button" onClick="calc()" value="合計"> </form> </body> </html>
補足説明 なし

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA