回答編集履歴

2

個別チェック時の処理の解釈が誤っていたのを修正

2016/03/16 09:00

投稿

think49
think49

スコア18156

test CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
 
6
6
 
7
- - [input[type=checkbox] を全てチェックする - JSFiddle](https://jsfiddle.net/kw3uaqv4/2/)
7
+ - [input[type=checkbox] を全てチェックする - JSFiddle](https://jsfiddle.net/kw3uaqv4/3/)
8
8
 
9
9
 
10
10
 
@@ -172,4 +172,12 @@
172
172
 
173
173
 
174
174
 
175
+ **(更新履歴)**
176
+
177
+ - 2016/03/16 17:11 changeイベントに変更。個別チェック時に一括チェックと連動するように修正。
178
+
179
+ - 2016/03/16 18:00 個別チェック時の処理の解釈が誤っていたのを修正
180
+
181
+
182
+
175
183
  Re: ao_love さん

1

changeイベントに変更。個別チェック時に一括チェックと連動するように修正。

2016/03/16 09:00

投稿

think49
think49

スコア18156

test CHANGED
@@ -4,7 +4,7 @@
4
4
 
5
5
 
6
6
 
7
- - [input[type=checkbox] を全てチェックする - JSFiddle](https://jsfiddle.net/kw3uaqv4/1/)
7
+ - [input[type=checkbox] を全てチェックする - JSFiddle](https://jsfiddle.net/kw3uaqv4/2/)
8
8
 
9
9
 
10
10
 
@@ -42,17 +42,15 @@
42
42
 
43
43
  document.addEventListener('DOMContentLoaded', function (event) {
44
44
 
45
- function handleClick (event) {
45
+ function handleChange (event) {
46
46
 
47
47
  var input = event.target,
48
48
 
49
- checked = input.checked,
49
+ checked = input.checked;
50
-
51
- genre = input.form.elements['genre[]'];
52
50
 
53
51
 
54
52
 
55
- if (input.id !== 'allcheck') {
53
+ if (input.tagName !== 'INPUT') {
56
54
 
57
55
  return;
58
56
 
@@ -60,9 +58,17 @@
60
58
 
61
59
 
62
60
 
63
- for (var i = 0, l = genre.length; i < l; ++i) {
61
+ if (input.id === 'allcheck') {
64
62
 
63
+ for (var i = 0, genre = input.form.elements['genre[]'], l = genre.length; i < l; ++i) {
64
+
65
- genre[i].checked = checked;
65
+ genre[i].checked = checked;
66
+
67
+ }
68
+
69
+ } else if (input.name === 'genre[]') {
70
+
71
+ input.form.elements['allcheck'].checked = checked;
66
72
 
67
73
  }
68
74
 
@@ -98,7 +104,7 @@
98
104
 
99
105
  ul.insertBefore(li, ul.firstElementChild);
100
106
 
101
- input.addEventListener('click', handleClick, false);
107
+ ul.addEventListener('change', handleChange, false);
102
108
 
103
109
  }
104
110