- ベストアンサー
javascript 計算フォーム
見積フォームを作っているのですがjavascript に精通してないので詳しい方教えて頂けますか。 下記のようにnew Arrayで値を取得してますが３つ目の項目”メーカー名”はどれを選んでも金額は同じなので簡単に記述出来ないでしょうか？ 合計金額取得後ＣＧＩに送信したいので項目名は必要です。 いろいろ検索してみましたが私のスキルでは解決できないのでよろしくお願いします。 ちなみにjavascriptの 計算フォームは部品の共存（セレクトメニューとラジオボタンなど）は出来ませんよね。 ======================================== <html> <head> </head> <script language="javascript"> <!-- n_table1 = new Array(30000,20000,18000,9000); n_table2 = new Array(8000,14800,6980); n_table3 = new Array(3000,3000,3000,3000,3000,3000,3000,3000,3000,3000,3000,3000); function keisan(obj) { var outStr=""; var total=0; total = total + n_table1[document.form1.koumoku1.selectedIndex]; total = total + n_table2[document.form1.koumoku2.selectedIndex]; total = total + n_table3[document.form1.koumoku3.selectedIndex]; outStr = "合計 : ￥" + total; document.form2.outbox.value=outStr; } // --> </script> <body> <center> <br> <form name="form1" METHOD="POST"> <table cellspacing="0" cellpadding="8" border="1" bordercolor="#FFA828"> <tr> <td>商品 Ａ</td> <td> <select name="koumoku1"> <option>Pentium <option>Celeron <option>Athlon <option>Duron </select> </td> </tr> <tr> <td>商品 Ｂ</td> <td> <select name="koumoku2"> <option>F2MX200 <option>LE Ultra <option>Kyro </select> </td> </tr> <tr> <td>メーカー名</td> <td> <select name="koumoku3"> <option>Ａ社 <option>Ｂ社 <option>Ｃ社 <option>Ｄ社 <option>Ｅ社 <option>Ｆ社 <option>Ｇ社 <option>Ｈ社 <option>Ｉ社 <option>Ｊ社 <option>Ｋ社 <option>Ｌ社 </select> </td> </tr> </table> <p> <input type="button" value="計算する" onClick="keisan(this.form)"> </form> <p><br> <form name="form2"> <TEXTAREA NAME="outbox" rows=1 cols=36 wrap="soft"> 計算結果表示 </textarea> </form> </center> </body> </html> ========================================
- Naodes
- お礼率25% (10/40)
- JavaScript
- 回答数3
- ありがとう数4
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
全社同じなら、それって単純に配列使わなければいいだけじゃない？ > n_table3 = 3000; > total = total + n_table3; 選択にかかわらず こうなるだけでしょ？ 配列にするということは、 どこか一箇所が別の金額になる可能性があるからなんじゃないの？ それがないなら配列にする必要性はないわ。 文字数を減らしたいだけなら n_table1 = new Array(30000,20000,18000,9000); を n_table1 = [30000,20000,18000,9000]; と書けばできるけど。
その他の回答 (2)
- yambejp
- ベストアンサー率51% (3827/7415)
普通、やるならこんな感じで、対比表をつくってやりますね。 おそらくn_table3も、ある場合だけ3000以外になるかもしれないということですよね？ <script> n_table1 = {"Pentium":30000,"Celeron":20000,"Athlon":18000,"Duron":9000}; n_table2 = {"F2MX200":8000,"LE Ultra":14800,"Kyro":6980}; n_table3 =new Object(); var koumoku3list=["a","b","c","d","e","f","g","h","i","j","k","l"]; for(var i in koumoku3list){ n_table3[koumoku3list[i]]=3000; } function keisan(f) { var outStr=""; var total=0; total += n_table1[f.elements["koumoku1"].value]; total += n_table2[f.elements["koumoku2"].value]; total += 3000; outStr = "合計 : ￥" + total; document.getElementById("form2").elements["outbox"].value=outStr; } </script> <style> .ie{ text-align:center; } .ie table{ width:auto; margin:auto; } #table1{ border-collapse:collapse; } #table1 td{ border:1px solid #FFA828; padding:8px; } </style> <div class="ie"> <form id="form1" METHOD="POST"> <table id="table1"> <tr> <td>商品 Ａ</td> <td> <select name="koumoku1"> <option value="Pentium">Pentium</option> <option value="Celeron">Celeron</option> <option value="Athlon">Athlon</option> <option value="Duron">Duron</option> </select> </td> </tr> <tr> <td>商品 Ｂ</td> <td> <select name="koumoku2"> <option value="F2MX200">F2MX200</option> <option value="LE Ultra">LE Ultra</option> <option value="Kyro">Kyro</option> </select> </td> </tr> <tr> <td>メーカー名</td> <td> <select name="koumoku3"> <option value="a">Ａ社</option> <option value="b">Ｂ社</option> <option value="c">Ｃ社</option> <option value="d">Ｄ社</option> <option value="e">Ｅ社</option> <option value="f">Ｆ社</option> <option value="g">Ｇ社</option> <option value="h">Ｈ社</option> <option value="i">Ｉ社</option> <option value="j">Ｊ社</option> <option value="k">Ｋ社</option> <option value="l">Ｌ社</option> </select> </td> </tr> </table> <input type="button" value="計算する" onClick="keisan(this.form)"> </form> <form id="form2"> <TEXTAREA NAME="outbox" rows=1 cols=36 wrap="soft"> 計算結果表示 </textarea> </form> </div>
お礼
n_table3の価格は変動する事もあります。 丁寧な説明ありがとうございました。
- fujillin
- ベストアンサー率61% (1594/2576)
よくわからないけど… わざわざ計算しなければよいのでは？ total = total + n_table3[～～] を total += 3000; みたいに固定しちゃえば、配列そのものが不要になります。 ＞ＣＧＩに送信したいので項目名は必要です 余計なお世話かもしれないけれど、サーバに送るのなら、form1の内容だけ送信して、スクリプトでの計算は表示用に限定しておいたほうがよろしいかと… 金額はサーバ側で計算し直すことをお勧めします。（送信データは偽れるので） おまけに、現状だと、ソースを見れば価格設定が丸見えだけれど、かまわないのかなぁ…
補足
new Array は無くてもいいんですね。 参考になりました。 無料配布のスクリプトをそのまま使用しているのですが new Array と指定したのはなにか意味があったのか？