回答編集履歴

3

一部確認漏れがあったので修正

2018/04/05 10:17

投稿

m.ts10806
m.ts10806

スコア80854

test CHANGED
@@ -30,7 +30,7 @@
30
30
 
31
31
  var fluits_list = $(".fluits p");
32
32
 
33
-
33
+
34
34
 
35
35
  //チェックボックスのチェック状態により作動
36
36
 
@@ -48,11 +48,7 @@
48
48
 
49
49
  //半角スペースで結合
50
50
 
51
- color_list = color.get().join(" ");
52
-
53
-
54
-
55
- if(color_list == ""){
51
+ if(color.length == 0){
56
52
 
57
53
  fluits_list.css('color', '#ddd');
58
54
 
@@ -62,17 +58,27 @@
62
58
 
63
59
  for(i=0;i<fluits_list.length;i++){
64
60
 
65
- //対象のクラスを持っていれば黒に
61
+ hasCount = 0;
66
62
 
63
+ for(colori=0;colori<color.length;colori++){
64
+
67
- if($(fluits_list[i]).hasClass(color_list)){
65
+ if($(fluits_list[i]).hasClass(color[colori])){
66
+
67
+ hasCount++;
68
+
69
+ }
70
+
71
+ }
72
+
73
+ if(hasCount==color.length){ //チェックされたもの全て持っていれば黒に
74
+
75
+ //if(hasCount>0){ //チェックされたもの1つでも持っていれば黒に
68
76
 
69
77
  $(fluits_list[i]).css('color', '#000');
70
78
 
71
79
  }else{
72
80
 
73
- $(fluits_list[i]).css('color', '#ddd');
81
+ $(fluits_list[i]).css('color', '#ddd');
74
-
75
-
76
82
 
77
83
  }
78
84
 

2

誤字修正

2018/04/05 10:17

投稿

m.ts10806
m.ts10806

スコア80854

test CHANGED
@@ -1,4 +1,4 @@
1
- もっと完結にかけるかもしれませんが。
1
+ もっと簡潔にかけるかもしれませんが。
2
2
 
3
3
  ```html
4
4
 

1

追記

2018/04/05 08:38

投稿

m.ts10806
m.ts10806

スコア80854

test CHANGED
@@ -17,6 +17,8 @@
17
17
 
18
18
 
19
19
  それぞれにクラスを振っておき、そのクラスを含むかどうかで判断します。
20
+
21
+ これなら項目が増えてもclass振るだけなのでjavascript側は変えずにhtmlの方だけ増やせばOKとなるはず。
20
22
 
21
23
 
22
24