- ベストアンサー
JavaScriptによる自動計算フォーム
サンプルを読んだりは多少わかる範囲なのですが、カスタムの段階で詰まってしまいましたのでお知恵お貸し頂ければと思います。 積算の自動計算フォームを作成しようとしてるのですが、サンプルでよくあるものが固定数値×プルダウン＝小計のようなものが多く、この固定数を入力フォーム、プルダウンも入力フォームに切り替えたいのですが、変更すると合計欄がNaNと表示されてしまいます。 何か指定が間違っているのでしょうか。 こちらのサイトを参考に作っています。 http://www.tagindex.com/javascript/form/comp1b.html 宜しくお願いします。
- Rafi
- お礼率98% (112/114)
- JavaScript
- 回答数1
- ありがとう数10
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
まず、ご質問の内容についてですが・・・、 実際のコードを示せば、すぐに的確な回答がついたかもしれません。 本題に戻ります。たぶんどこかで構文ミスをしているのでしょう。 私もよくやってしまうのですが、NaN や undefined が出ます。 内容が複雑ではないので、私なりに作成してみました。 入力フォームということで、テキストボックスで良いでしょうか。 <html><head> <script type='text/javascript'> function keisan(){ var price1 = (document.form1.tanka1.value) * (document.form1.suryo1.value); document.form1.kingaku1.value = price1 ; var price2 = (document.form1.tanka2.value) * (document.form1.suryo2.value); document.form1.kingaku2.value = price2 ; var price3 = (document.form1.tanka3.value) * (document.form1.suryo3.value); document.form1.kingaku3.value = price3 ; document.form1.total.value = price1 + price2 +price3; } </script></head> <body> <form name='form1'> <table border='1'> <tr><td align='center'>商品</td> <td align='center'>単価</td> <td align='center'>数量</td> <td align='center'>金額</td></tr> <tr><td>商品1</td> <td><input type='text' name='tanka1' onChange='keisan()' style='width:100px' />円</td> <td><input type='text' name='suryo1' onChange='keisan()' style='width:50px' /></td> <td><input type='text' name='kingaku1' style='width:100px' />円</td></tr> <tr><td>商品2</td> <td><input type='text' name='tanka2' onChange='keisan()' style='width:100px' />円</td> <td><input type='text' name='suryo2' onChange='keisan()' style='width:50px' /></td> <td><input type='text' name='kingaku2' style='width:100px' />円</td></tr> <tr><td>商品3</td> <td><input type='text' name='tanka3' onChange='keisan()' style='width:100px' />円</td> <td><input type='text' name='suryo3' onChange='keisan()' style='width:50px' /></td> <td><input type='text' name='kingaku3' style='width:100px' />円</td></tr> <tr><td align='right' colspan=3>合計</td> <td><input type='text' name='total' style='width:100px' />円</td></tr> </table> </form> </body></html>
お礼
ありがとうございます！ 作成して頂いた内容と自分のを見比べてみると、onChangeの扱いがおかしかったようです。 指定するものを間違っていました。 JSは本当に苦手で飲み込みにくいのですが、大変参考になりました。 本当に助かりました。