![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
サンプルを読んだりは多少わかる範囲なのですが、カスタムの段階で詰まってしまいましたのでお知恵お貸し頂ければと思います。
積算の自動計算フォームを作成しようとしてるのですが、サンプルでよくあるものが固定数値×プルダウン=小計のようなものが多く、この固定数を入力フォーム、プルダウンも入力フォームに切り替えたいのですが、変更すると合計欄がNaNと表示されてしまいます。
何か指定が間違っているのでしょうか。
こちらのサイトを参考に作っています。
http://www.tagindex.com/javascript/form/comp1b.h …
宜しくお願いします。
No.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は本当に苦手で飲み込みにくいのですが、大変参考になりました。
本当に助かりました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
- ・ゆるやかでぃべーと タイムマシンを破壊すべきか。
- ・歩いた自慢大会
- ・許せない心理テスト
- ・字面がカッコいい英単語
- ・これ何て呼びますか Part2
- ・人生で一番思い出に残ってる靴
- ・ゆるやかでぃべーと すべての高校生はアルバイトをするべきだ。
- ・初めて自分の家と他人の家が違う、と意識した時
- ・単二電池
- ・チョコミントアイス
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
formで項目を連結したい
-
JavaScriptによる自動計算フォーム
-
同一nameの input type="text"...
-
チェックボックス付きのテーブ...
-
画面表示とともにtableの指定の...
-
return trueとreturn falseの用...
-
プルダウン 項目が多いので先頭...
-
一覧から選択した行の行番号を...
-
onchangeイベントを強制的に発...
-
<JavaScript>tableタグを入力不...
-
JavaScriptにて動的に配列を作...
-
submitした値を返したい
-
slickのレスポンシブ > center...
-
クリックさせたいが、click()が...
-
name属性のないformタグの、中...
-
ラジオボタンにタブインデック...
-
特定<table>内の<td>の色を変える
-
マイナスなら赤字で表示したい...
-
【jQuery】input nameの文字列...
-
%の計算の仕方
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
チェックボックス付きのテーブ...
-
JavaScriptの「.querySelectorA...
-
formで項目を連結したい
-
Formのシリアライズができない
-
画面表示とともにtableの指定の...
-
文字数を数える際に空白、改行...
-
クリックしたラジオボタンの行...
-
ラジオボタンを一括で操作する...
-
画面の2重起動をチェックする...
-
ラジオボタンとテキストボック...
-
Javascriptの電卓で最初の何も...
-
入力チェックの外部スクリプト...
-
JavaScriptによる自動計算フォーム
-
複数のselect値で1つも選択され...
-
javascriptで表(テーブル)の自...
-
jQueryで合計を出したい
-
localStorageでのcheckbox制御
-
JavaScriptで、コピーボタンを...
-
Javascriptで自動的に計算する...
-
WEBフォーム(asp)から画像デ...
おすすめ情報