たくさんのチェックボックスを短いコードで処理したい

###前提・実現したいこと
大量のチェックボックを短いコードで処理したい

###該当のソースコード

javascript
1check1 = document.form1.Checkbox1.checked;
2check2 = document.form1.Checkbox2.checked;
3・
4・
5・
6if (check1) {・・・}
7if (check2) {・・・}
8・
9・
10・

のようなコードをできるだけ短くしたいです

行動規範の内容に同意します

回答3件

ベストアンサー

html
1<html>
2<head>
3<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
4</head>
5<body>
6<input type='checkbox' class='chkbx' name='checkbox1'>checkbox1<br>
7<input type='checkbox' class='chkbx' name='checkbox2'>checkbox2<br>
8<input type='checkbox' class='chkbx' name='checkbox3'>checkbox3<br>
9<input type='checkbox' class='chkbx' name='checkbox4'>checkbox4<br>
10<input type='checkbox' class='chkbx' name='checkbox5'>checkbox5<br>
11
12<button id='chkbtn' onclick="test();">cehck</button>
13<script>
14
15function test(){
16	[].forEach.call(document.getElementsByClassName("chkbx"),function(elm){
17    	if(elm.checked==true)
18		{
19			console.log(elm.getAttribute('name') + ' is checked');
20		}
21      });
22}
23</script>
24</body>
25</html>
26

こんな感じでどうですか

投稿2016/11/06 05:04

hiim

総合スコア1689

if (check1) {・・・}

の中身がどうしたいかによって共通化できるかどうかが決まってきます
ざっとこんな感じでcheckされたものを判断することは可能です

HTML
1<script>
2function mycheck(){
3  var el=document.getElementsByTagName('input');
4  for(var i=0;i<el.length;i++){
5    if(el[i].type=='checkbox' && (r=el[i].name.match(/^checkbox([0-9]+)$/))){
6      if(el[i].checked){
7        console.log(r[1]);
8      }
9    }
10  }
11}
12</script>
13
14<input type='checkbox' name='checkbox1'>checkbox1<br>
15<input type='checkbox' name='checkbox2'>checkbox2<br>
16<input type='checkbox' name='checkbox3'>checkbox3<br>
17<input type='checkbox' name='checkbox4'>checkbox4<br>
18<input type='checkbox' name='checkbox5'>checkbox5<br>
19<input type='button' value='go' onclick='mycheck()'>
20