Javascriptでラジオボタンとチェックボックスの値を足して計算しようとしました。
しかし、チェックボックス同士の値は足されるのですが、ラジオボタンの値は計算されずにそのまま表示されます。
ラジオボタンの値も足されるようにするにはどうしたら良いでしょうか。
よろしくお願いいたします。
javascript↓
function calc2() {
var ss="";
var fs= document.forms;
for (var f=0 ; f<fs.length ; f++) {//formが複数ある場合、formの数だけ繰り返し
d = fs[f].elements;//dにform内のエレメントを代入
checkvalue = 0;//checkvalueの値を0にする。ここをcheckvalue = ""; にすると、文字列として扱われる
for (var i = 0; i < d.length; i++ ) {//form内のエレメントの数だけ繰り返し
if (d[i].checked == true) {//チェックボックスがチェックされていたら
checkvalue += Number(d[i].value);//checkvalueの値(整数の場合)にそれぞれのエレメントの値(value)を追加していく
}
}
ss += checkvalue;
function addFigure(str) {//3桁のカンマ挿入
var num = new String(str).replace(/,/g, "");
while(num != (num = num.replace(/^(-?\d+)(\d{3})/, "$1,$2")));
return num;
}
var sss = addFigure(ss);//ssの値にカンマを挿入してsssに代入
}
document.getElementById('ch_all').innerHTML = "\\" + sss;//html本文内のid="ch_all"の場所に書き出す
}
html↓
<html>
<head>
<script type="text/javascript">
</script>
<script type='text/javascript' src='test_checked2.js'></script>
</head>
<body>
<div id="ch_all" style="background-color: #eeeeee;"></div>
<hr />
<form name="Tform1">
<input type="radio" name="test" value="34500" onclick="calc2()">
\34,500
<input type="radio" name="test" value="15000" onclick="calc2()">
\15,000
<input type="radio" name="test" value="3000" onclick="calc2()">
\3,000
<input type="radio" name="test" value="4444" onclick="calc2()">
\4,444
</form>
<form name="Tform2">
<input type="checkbox" name="test2" value="34500" onclick="calc2()">
\34,500
<input type="checkbox" name="test2" value="15000" onclick="calc2()">
\15,000
<input type="checkbox" name="test3" value="3000" onclick="calc2()">
\3,000
<input type="checkbox" name="test4" value="4444" onclick="calc2()">
\4,444
</form>
</body>
</html>
No.1ベストアンサー
- 回答日時:
チェックボックスとラジオボタンの値を合計すればよいと解釈しました。
解説は省略。(value値はカンマなしと仮定)
function calc2() {
var i = 0, f, frms = document.forms;
var j, el, total = 0, num;
while (f = frms[i++]) {
j = 0;
while (el = f.elements[j++]) {
if (el.checked && (el.type == 'radio' || el.type == 'checkbox') && !isNaN(el.value)) total += 1 * el.value;
}
}
num = total.toString();
while(num != (num = num.replace(/^(-?\d+)(\d{3})/, "$1,$2")));
document.getElementById('ch_all').innerHTML = '\\' + num;
}
早速の回答ありがとうございます!
希望通りの動作ができました。しかもコードがすっきりして見やすいです。
素晴らしい!
頂いた回答を元に、もっと勉強したいと思います。
本当にありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- HTML・CSS ただいま勉強始めたての初心者です。フォームを縦並べにしたいです。 2 2022/11/20 17:18
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- PHP 入力した部分を表示させたまま(保持)するにはどうすれば良いでしょうか? 1 2023/01/25 11:14
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript HTMLでJavaScriptを使ってパスワードの強化判定のプログラムを作成しています。 一通り作っ 2 2022/10/19 01:41
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Form内のselectを連動させるに...
-
ラジオボタンにタブインデック...
-
javascript作成してます。ラジ...
-
jQueryで複数のラジオボタンを処理
-
チェックボックスのON/OFFに連...
-
ラジオボタンを使った簡単なア...
-
データベースの値を判断してラ...
-
ラジオボタンでdisabledとchecked
-
フォームPOST後「戻る」時のチ...
-
ラジオボタンでチェックした項...
-
チェックボックスとテキストボ...
-
jsでラジオボタンによって表示...
-
jQueryを使った診断チェックシート
-
return trueとreturn falseの用...
-
Javascriptでのbuttonのname属...
-
全てのselect要素をデフォルト...
-
一覧から選択した行の行番号を...
-
プルダウン 項目が多いので先頭...
-
プルダウンで選択すると、DBの...
-
【jsp/Java】チェックボックス...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ラジオボタンのチェックが外れ...
-
ラジオボタンにタブインデック...
-
javascript作成してます。ラジ...
-
ラジオボタンでdisabledとchecked
-
フォームPOST後「戻る」時のチ...
-
チェックボックスのON/OFFに連...
-
ラジオボタンの値でリンク先を...
-
Jvasvriptのlengthで個数が取得...
-
ラジオボタンのvalueとlabelの...
-
ラジオボタンで診断テストを作...
-
ラジオボタンの分岐方法に関して
-
チェックされたラジオボタンに...
-
Firefoxのdisabledプロパティの...
-
データベースの値を判断してラ...
-
ラジオボタンのリセット方法
-
【診断テストの作り方】結果に...
-
javascriptでクイズ
-
Form内のselectを連動させるに...
-
ラジオボタンでテキストボック...
-
ラジオボタンにチェックを入れ...
おすすめ情報