JavaScriptのカスタムの段階で詰まってしまいましたのでお知恵お貸し頂ければと思います。
積算の自動計算フォームを作成しようとしてるのですが、下記URLを参考にselectタグだけではなく、radioボタンやcheckboxでも計算できるようにしたいと思いカスタムしようとしているんですがNaNと表示されてしまい、うまくいきません。
何か指定が間違っているのでしょうか。
こちらのサイトを参考に作っています。
http://www.tagindex.com/javascript/form/comp1a.h …
宜しくお願いします。
No.1ベストアンサー
- 回答日時:
たとえばこんな感じ
<script>
document.addEventListener('change',function(e){
var t=e.target;
if(t.nodeName=="INPUT" ||t.nodeName=="SELECT"){
var num=0;
var f=t.form;
for(var i=0;i<f.length;i++){
if(f[i].name=="ans") continue;
if((f[i].type=="checkbox" ||f[i].type=="radio") && f[i].checked ||f[i].type=="text") num+=parseInt(f[i].value);
if(f[i].type=="select-one") num+=parseInt(f[i].options[f[i].selectedIndex].value);
}
f.elements["ans"].value=num;
}
});
</script>
<form>
<input type="checkbox" name="a" value="100">100
<input type="checkbox" name="b" value="200">200
<input type="checkbox" name="c" value="300">300
<input type="radio" name="d" value="0" checked>0
<input type="radio" name="d" value="400">400
<input type="radio" name="d" value="500">500
<select name="e">
<option value="0">0</option>
<option value="600">600</option>
<option value="700">700</option>
</select>
<input type="text" name="f" value="0"><br>
ans:<input type="text" name="ans" value="0" readonly>
</form>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript 空白で入力フォームのボタンをクリックしたら、ブラウザの上部からjavascriptで 表示されるアラ 1 2022/05/20 11:16
- その他(コンピューター・テクノロジー) 4勤2休のシフト作成 1 2022/12/15 15:38
- JavaScript フォームが空欄の時にフォームの外をクリックすると、エラーが出るコードを調べています。 1 2023/06/25 11:51
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- Excel(エクセル) エクセルで値ではなく関数を参照する方法 6 2023/03/19 00:50
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- Excel(エクセル) 電卓は正しいのに エクセルで計算させると間違った答えです。なぜ? 7 2022/08/11 07:04
- 財務・会計・経理 決算時の未払消費税の計上について(法人です) 4 2022/09/10 12:14
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
value内に変数を入れたい
-
hiddenのvalueの値を変えたい
-
javascriptでhiddenに二次元配...
-
他フォームの入力データの引継ぎ
-
VBAをJavaScriptに変換したいです
-
setIntervalの間隔を途中で変更...
-
フォームで入力した値を別のフ...
-
【Javascript】formで取得した...
-
ラジオボタンの選択で解答・点...
-
JavaScriptによる自動計算フォ...
-
値を初期化したい。
-
複数のsubmitボタンで押された...
-
フォーカスすると初期値が消去...
-
JAVASCRIPTで、ボタンを押した...
-
ラジオボタンと連動して文字列...
-
return trueとreturn falseの用...
-
<JavaScript>tableタグを入力不...
-
【jQuery】input nameの文字列...
-
onchangeイベントを強制的に発...
-
javascriptでASPにデータを渡す
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
value内に変数を入れたい
-
hiddenのvalueの値を変えたい
-
javascriptでhiddenに二次元配...
-
複数のsubmitボタンで押された...
-
テキストボックスに入力された...
-
switchを使って四則演算のプロ...
-
VB.NET DateTimeの型について
-
クイズ作成:15個の問題から5個...
-
C言語クイックソートの比較総回...
-
セレクトボックスの初期選択状...
-
ラジオボタンの選択で解答・点...
-
子から親へチェックボックスの...
-
ラジオボタンと連動して文字列...
-
setIntervalの間隔を途中で変更...
-
JAVASCRIPTで、ボタンを押した...
-
sessionStorageを調べています。
-
クリックの度に加算していくには?
-
マクロ オブジェクト変数With...
-
3桁区切りのカンマをつけたい...
-
selectboxのoptionタグのvalue...
おすすめ情報