inputタグ(checkされたとこ)から数値を取得

Question

<input type="checkbox">にvalue（数値）を追加して
ボタンが押されると、checkされたところ全部のvalueの値を集計する
方法を教えてください

Comments

[m.ts10806]

「チェックボックス　値取得」とかで調べたら幾らでも出てくるように思いますが、何も調べてないのでしょうか。

[yambejp]

「value（数値）を追加」する方法が知りたいのですか？
追加されたvalueを加算する方法が知りたいのですか？

Answer 1

<script>
document.addEventListener('change',()=>{
  const num=[...document.querySelectorAll('[type=checkbox]:checked')].reduce((x,y)=>x+parseInt(y.value),0);
  document.querySelector('#ans').value=num;
});
</script>
<label><input type="checkbox" value="1">1</lable>
<label><input type="checkbox" value="2">2</lable>
<label><input type="checkbox" value="3">3</lable>
<label><input type="checkbox" value="4">4</lable><br>
ans:<input type="text" id="ans">