JavaScriptによる自動計算フォームでチェックボックスやラジオボタンでも計算したい

JavaScriptのカスタムの段階で詰まってしまいましたのでお知恵お貸し頂ければと思います。

積算の自動計算フォームを作成しようとしてるのですが、下記URLを参考にselectタグだけではなく、radioボタンやcheckboxでも計算できるようにしたいと思いカスタムしようとしているんですがNaNと表示されてしまい、うまくいきません。
何か指定が間違っているのでしょうか。

こちらのサイトを参考に作っています。
http://www.tagindex.com/javascript/form/comp1a.h …
宜しくお願いします。

No.1 ベストアンサー 回答者： yambejp 回答日時： 2017/06/16 22:11

たとえばこんな感じ

<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>

この回答へのお礼

とても参考になり助かりました！
ありがとうございました^^

お礼日時：2017/06/18 14:13