teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問jQueryの絞り込み検索（３つの条件 or検索）について

編集履歴

質問編集履歴

1

Javascriptに全角空白が入っているとのご指摘いただきまして、コードを貼り直しました。

2018/03/26 05:17

投稿

alpaca540
alpaca540

スコア18

test CHANGED
File without changes
test CHANGED
@@ -90,140 +90,132 @@
90
90
 
91
91
 
92
92
 
93
+
94
+
95
+
96
+
97
+
98
+
99
+
100
+
101
+
102
+
103
+
104
+
105
+ ### 試したこと
106
+
93
- ```css
107
+ ```javascript
94
-
95
- <input[type=checkbox] {
108
+
96
-
97
- display: none;
109
+ $(function(){
110
+
98
-
111
+ 　$('.result section').show();
112
+
113
+
114
+
115
+ 　$('#style,#color,#size').find('input').on('click',function(){
116
+
117
+ $('.result section').hide();
118
+
119
+ $('#style [type=checkbox]:checked').each(function(){
120
+
121
+ var checkstyle=$(this).prop('id');
122
+
123
+ $('#color [type=checkbox]:checked').each(function(){
124
+
125
+ var checkcolor=$(this).prop('id');
126
+
127
+ $('#size [type=checkbox]:checked').each(function(){
128
+
129
+ var checksize=$(this).prop('id');
130
+
131
+ $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checkcolor) && $(this).hasClass(checksize);}).fadeIn();
132
+
133
+
134
+
135
+ });
136
+
137
+ });
138
+
139
+
140
+
141
+ 　if($('#style [type=checkbox]:checked').length==0){
142
+
143
+ $('#color [type=checkbox]:checked').each(function(){
144
+
145
+ var checkcolor=$(this).prop('id');
146
+
147
+ $('#size [type=checkbox]:checked').each(function(){
148
+
149
+ var checksize=$(this).prop('id');
150
+
151
+ $('.result section').filter(function(){return $(this).hasClass(checkcolor) && $(this).hasClass(checksize);}).fadeIn();
152
+
153
+ });
154
+
155
+ });
156
+
99
- }
157
+ };
158
+
159
+
160
+
161
+ 　if($('#color [type=checkbox]:checked').length==0){
162
+
163
+ $('#style [type=checkbox]:checked').each(function(){
164
+
165
+ var checkstyle=$(this).prop('id');
166
+
167
+ $('#size [type=checkbox]:checked').each(function(){
168
+
169
+ var checksize=$(this).prop('id');
170
+
171
+ $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checksize);}).fadeIn();
172
+
173
+ });
174
+
175
+ });
176
+
177
+ };
178
+
179
+
180
+
181
+ 　if($('#size [type=checkbox]:checked').length==0){
182
+
183
+ $('#style [type=checkbox]:checked').each(function(){
184
+
185
+ var checkstyle=$(this).prop('id');
186
+
187
+ $('#color [type=checkbox]:checked').each(function(){
188
+
189
+ var checkcolor=$(this).prop('id');
190
+
191
+ $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checkcolor);}).fadeIn();
192
+
193
+ });
194
+
195
+ });
196
+
197
+ };
198
+
199
+
200
+
201
+ 　if($('#select [type=checkbox]:checked').length==0){
202
+
203
+ $('.result section').fadeIn();
204
+
205
+ };
206
+
207
+ 　})
208
+
209
+ });
210
+
211
+
212
+
213
+ function allselect() {
214
+
215
+ $('.result section').fadeIn();
216
+
217
+ $('#select input[type="checkbox"]').prop('checked', false);
218
+
219
+ };
100
220
 
101
221
  ```
102
-
103
-
104
-
105
-
106
-
107
-
108
-
109
-
110
-
111
-
112
-
113
- ### 試したこと
114
-
115
- ```javascript
116
-
117
- $(function(){
118
-
119
- 　$('.result section').show();
120
-
121
-
122
-
123
- 　$('#style,#color,#size').find('input').on('click',function(){
124
-
125
- $('.result section').hide();
126
-
127
- $('#style [type=checkbox]:checked').each(function(){
128
-
129
- var checkstyle=$(this).prop('id');
130
-
131
- $('#color [type=checkbox]:checked').each(function(){
132
-
133
- var checkcolor=$(this).prop('id');
134
-
135
- $('#size [type=checkbox]:checked').each(function(){
136
-
137
- var checksize=$(this).prop('id');
138
-
139
- $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checkcolor) && $(this).hasClass(checksize);}).fadeIn();
140
-
141
- });
142
-
143
- });
144
-
145
- });
146
-
147
-
148
-
149
- 　if($('#style [type=checkbox]:checked').length==0){
150
-
151
- $('#color [type=checkbox]:checked').each(function(){
152
-
153
- var checkcolor=$(this).prop('id');
154
-
155
- $('#size [type=checkbox]:checked').each(function(){
156
-
157
- var checksize=$(this).prop('id');
158
-
159
- $('.result section').filter(function(){return $(this).hasClass(checkcolor) && $(this).hasClass(checksize);}).fadeIn();
160
-
161
- });
162
-
163
- });
164
-
165
- };
166
-
167
-
168
-
169
- 　if($('#color [type=checkbox]:checked').length==0){
170
-
171
- $('#style [type=checkbox]:checked').each(function(){
172
-
173
- var checkstyle=$(this).prop('id');
174
-
175
- $('#size [type=checkbox]:checked').each(function(){
176
-
177
- var checksize=$(this).prop('id');
178
-
179
- $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checksize);}).fadeIn();
180
-
181
- });
182
-
183
- });
184
-
185
- };
186
-
187
-
188
-
189
- 　if($('#size [type=checkbox]:checked').length==0){
190
-
191
- $('#style [type=checkbox]:checked').each(function(){
192
-
193
- var checkstyle=$(this).prop('id');
194
-
195
- $('#color [type=checkbox]:checked').each(function(){
196
-
197
- var checkcolor=$(this).prop('id');
198
-
199
- $('.result section').filter(function(){return $(this).hasClass(checkstyle) && $(this).hasClass(checkcolor);}).fadeIn();
200
-
201
- });
202
-
203
- });
204
-
205
- };
206
-
207
-
208
-
209
- 　if($('#select [type=checkbox]:checked').length==0){
210
-
211
- $('.result section').fadeIn();
212
-
213
- };
214
-
215
- 　})
216
-
217
- });
218
-
219
-
220
-
221
- function allselect() {
222
-
223
- $('.result section').fadeIn();
224
-
225
- $('#select input[type="checkbox"]').prop('checked', false);
226
-
227
- };
228
-
229
- ```