teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

バグ修正

2016/08/05 08:52

投稿

NatsumiOki
NatsumiOki

スコア1298

answer CHANGED
@@ -1,36 +1,4 @@
1
- う~ん、こういうことでしょうか?
2
-
3
- ```
4
- var i,id,li,classArr,cnt;
1
+ すみません、さきほど掲載したの間違えていました。
5
-
2
+ CSSのソースもつけていなかったのでわかりにくかったと思います。
3
+ ちょっとわかりやすいように横並びに変えちゃいましたがこんな感じでしょうか?
6
- $('input[type="checkbox"]').on('change',function(){
4
+ [サンプル](http://codepen.io/mayo31/pen/XKxzzV)
7
- cnt = 0;
8
- id = $(this).attr('id');
9
- li = '.' + id;
10
- //チェックしたときは該当するclassを持つ要素を表示
11
- if($(this).prop('checked')===true) {
12
- $(li).css('display','block');
13
- }
14
- //チェックを外したときは
15
- else{
16
- //該当するclassを持つ要素をループ
17
- $.each($(li),function(){
18
- //今見ている要素のclass群をループ
19
- classArr = $(this).attr("class").split(" ");
20
- i = classArr.length;
21
- $.each(classArr,function(){
22
- //持っているclass群の中で、ほかにチェックされているか判定
23
- id = '#' + classArr[i];
24
- if($(id).prop('checked')===true){
25
- cnt++;
26
- }
27
- });
28
- if(cnt<1){
29
- $(li).css('display','none');
30
- }
31
-
32
- });
33
- }
34
- })
35
-
36
- ```