質問編集履歴

3

補足の追加

2019/02/06 13:01

投稿

takej3
takej3

スコア13

test CHANGED
File without changes
test CHANGED
@@ -50,7 +50,7 @@
50
50
 
51
51
  カテゴリーごとにeachで処理を使いまわしたいと考えているのですが、
52
52
 
53
- 「URLで取得した数値」と「liに付与されているclass」を取得しif文で条件分岐した際に下記3パターンを想定しています。
53
+ 「URLで取得した数値」と「liに付与されているclass」を取得しif文で条件分岐を想定しています。
54
54
 
55
55
  現状の//各カテゴリーアーカイブ表示の切り替え の記述ですと、
56
56
 

2

補足を追加

2019/02/06 13:01

投稿

takej3
takej3

スコア13

test CHANGED
File without changes
test CHANGED
@@ -32,6 +32,248 @@
32
32
 
33
33
 
34
34
 
35
+ ###追記
36
+
37
+ わかりづらく申し訳ありません。
38
+
39
+ 補足です。
40
+
41
+ 困っているのはjQueryに関してとなります。
42
+
43
+
44
+
45
+ //配列の型を数値に変更 までは問題がないのですが、
46
+
47
+ //各カテゴリーアーカイブ表示の切り替え からの処理に関して
48
+
49
+
50
+
51
+ カテゴリーごとにeachで処理を使いまわしたいと考えているのですが、
52
+
53
+ 「URLで取得した数値」と「liに付与されているclass」を取得しif文で条件分岐した際に下記3パターンを想定しています。
54
+
55
+ 現状の//各カテゴリーアーカイブ表示の切り替え の記述ですと、
56
+
57
+
58
+
59
+ http://○○○○○.com/○○○/○○○/**1901**/ の場合、
60
+
61
+ 下記のようになってほしいのですが、
62
+
63
+
64
+
65
+ ```HTML
66
+
67
+
68
+
69
+ <div class="archive">
70
+
71
+ <h3>アーカイブ見出し</h3>
72
+
73
+ <div class="archiveBox clearfix">
74
+
75
+ <ul class="archiveBox_item_box01">
76
+
77
+ <li class="1811 active"></li>
78
+
79
+ <li class="1807"></li>
80
+
81
+ <li class="1804"></li>
82
+
83
+ <li class="1802"></li>
84
+
85
+ </ul>
86
+
87
+ <ul class="archiveBox_item_box02">
88
+
89
+ <li class="1902"></li>
90
+
91
+ <li class="1810 active"></li>
92
+
93
+ <li class="1806"></li>
94
+
95
+ <li class="1803"></li>
96
+
97
+ <li class="1712"></li>
98
+
99
+ </ul>
100
+
101
+ <ul class="archiveBox_item_box03">
102
+
103
+ <li class="1812 active"></li>
104
+
105
+ <li class="1808"></li>
106
+
107
+ </ul>
108
+
109
+ <ul class="archiveBox_item_box04">
110
+
111
+ <li class="1901 active"></li>
112
+
113
+ <li class="1809"></li>
114
+
115
+ <li class="1805"></li>
116
+
117
+ <li class="1801"></li>
118
+
119
+ </ul>
120
+
121
+ </div>
122
+
123
+ </div>
124
+
125
+
126
+
127
+ ```
128
+
129
+
130
+
131
+ となってほしいのですが、現状は下記のようになってしまいます。
132
+
133
+
134
+
135
+ ```HTML
136
+
137
+
138
+
139
+ <div class="archive">
140
+
141
+ <h3>アーカイブ見出し</h3>
142
+
143
+ <div class="archiveBox clearfix">
144
+
145
+ <ul class="archiveBox_item_box01">
146
+
147
+ <li class="1811"></li>
148
+
149
+ <li class="1807"></li>
150
+
151
+ <li class="1804"></li>
152
+
153
+ <li class="1802"></li>
154
+
155
+ </ul>
156
+
157
+ <ul class="archiveBox_item_box02">
158
+
159
+ <li class="1902"></li>
160
+
161
+ <li class="1810"></li>
162
+
163
+ <li class="1806"></li>
164
+
165
+ <li class="1803"></li>
166
+
167
+ <li class="1712"></li>
168
+
169
+ </ul>
170
+
171
+ <ul class="archiveBox_item_box03">
172
+
173
+ <li class="1812"></li>
174
+
175
+ <li class="1808"></li>
176
+
177
+ </ul>
178
+
179
+ <ul class="archiveBox_item_box04">
180
+
181
+ <li class="1901 active"></li>
182
+
183
+ <li class="1809"></li>
184
+
185
+ <li class="1805"></li>
186
+
187
+ <li class="1801"></li>
188
+
189
+ </ul>
190
+
191
+ </div>
192
+
193
+ </div>
194
+
195
+
196
+
197
+ ```
198
+
199
+
200
+
201
+ また、http://○○○○○.com/○○○/○○○/**1806**/ の場合、
202
+
203
+
204
+
205
+ ```HTML
206
+
207
+
208
+
209
+ <div class="archive">
210
+
211
+ <h3>アーカイブ見出し</h3>
212
+
213
+ <div class="archiveBox clearfix">
214
+
215
+ <ul class="archiveBox_item_box01">
216
+
217
+ <li class="1811"></li>
218
+
219
+ <li class="1807"></li>
220
+
221
+ <li class="1804"></li>
222
+
223
+ <li class="1802"></li>
224
+
225
+ </ul>
226
+
227
+ <ul class="archiveBox_item_box02">
228
+
229
+ <li class="1902"></li>
230
+
231
+ <li class="1810"></li>
232
+
233
+ <li class="1806 active"></li>
234
+
235
+ <li class="1803"></li>
236
+
237
+ <li class="1712 active"></li>
238
+
239
+ </ul>
240
+
241
+ <ul class="archiveBox_item_box03">
242
+
243
+ <li class="1812"></li>
244
+
245
+ <li class="1808"></li>
246
+
247
+ </ul>
248
+
249
+ <ul class="archiveBox_item_box04">
250
+
251
+ <li class="1901"></li>
252
+
253
+ <li class="1809"></li>
254
+
255
+ <li class="1805"></li>
256
+
257
+ <li class="1801"></li>
258
+
259
+ </ul>
260
+
261
+ </div>
262
+
263
+ </div>
264
+
265
+
266
+
267
+ ```
268
+
269
+ エラーはなく、ページごとに意図はしていませんが処理はされているようです。
270
+
271
+ eachの使い方に問題があるのか、if文に問題があるのかわからない状況です。
272
+
273
+
274
+
275
+
276
+
35
277
 
36
278
 
37
279
  ### 発生している問題・エラーメッセージ

1

誤字によりjQueryのclass名を修正しました。

2019/02/06 13:00

投稿

takej3
takej3

スコア13

test CHANGED
File without changes
test CHANGED
@@ -182,6 +182,8 @@
182
182
 
183
183
 
184
184
 
185
+
186
+
185
187
  $(function() {
186
188
 
187
189
 
@@ -204,7 +206,7 @@
204
206
 
205
207
  var box03 = $('.archiveBox_item_box03');
206
208
 
207
- var box03 = $('.archiveBox_item_box03');
209
+ var box04 = $('.archiveBox_item_box04');
208
210
 
209
211
  var item_box01 = box01.find('li');
210
212
 
@@ -212,7 +214,7 @@
212
214
 
213
215
  var item_box03 = box03.find('li');
214
216
 
215
- var item_box03 = box03.find('li');
217
+ var item_box04 = box04.find('li');
216
218
 
217
219
 
218
220
 
@@ -224,7 +226,7 @@
224
226
 
225
227
  var item_box03Array = [];
226
228
 
227
- var item_box03Array = [];
229
+ var item_box04Array = [];
228
230
 
229
231
  item_box01.each(function(){
230
232
 
@@ -250,126 +252,126 @@
250
252
 
251
253
  });
252
254
 
255
+ item_box04.each(function(){
256
+
257
+ var class_box04 = $(this).attr('class');
258
+
259
+ item_box04Array.push(class_box04);
260
+
261
+ });
262
+
263
+
264
+
265
+ //配列の型を数値に変更
266
+
267
+ var item_box01Finish = item_box01Array.map(function (element) { return Number(element); });
268
+
269
+ var item_box02Finish = item_box02Array.map(function (element) { return Number(element); });
270
+
271
+ var item_box03Finish = item_box03Array.map(function (element) { return Number(element); });
272
+
273
+ var item_box04Finish = item_box04Array.map(function (element) { return Number(element); });
274
+
275
+
276
+
277
+ //各カテゴリーアーカイブ表示の切り替え
278
+
279
+ item_box01.each(function(){
280
+
281
+ var class_box01 = $(this).attr('class');
282
+
283
+ var num_box01 = Number(class_box01);
284
+
285
+ if($dir3 = num_box01) {
286
+
287
+ $('.archiveBox_item_box01 ').children("'."+$dir2+"'").addClass('active');
288
+
289
+ } else if($dir3 > num_box01) {
290
+
291
+ $('.archiveBox_item_box01 ').children("'."+$dir2+"'").addClass('active');
292
+
293
+ } else {
294
+
295
+ var minValue = Math.min.apply(null, item_box01Array);
296
+
297
+ $('.archiveBox_item_box01 ').children("'."+minValue+"'").addClass('active');
298
+
299
+ }
300
+
301
+ });
302
+
303
+ item_box02.each(function(){
304
+
305
+ var class_box02 = $(this).attr('class');
306
+
307
+ var num_box02 = Number(class_box02);
308
+
309
+ if($dir3 = num_box02) {
310
+
311
+ $('.archiveBox_item_box02 ').children("'."+$dir2+"'").addClass('active');
312
+
313
+ } else if($dir3 > num_box02) {
314
+
315
+ $('.archiveBox_item_box02 ').children("'."+$dir2+"'").addClass('active');
316
+
317
+ } else {
318
+
319
+ var minValue = Math.min.apply(null, item_box02Array);
320
+
321
+ $('.archiveBox_item_box02 ').children("'."+minValue+"'").addClass('active');
322
+
323
+ }
324
+
325
+ });
326
+
253
327
  item_box03.each(function(){
254
328
 
255
329
  var class_box03 = $(this).attr('class');
256
330
 
257
- item_box03Array.push(class_box03);
258
-
259
- });
260
-
261
-
262
-
263
- //配列の型を数値に変更
264
-
265
- var item_box01Finish = item_box01Array.map(function (element) { return Number(element); });
266
-
267
- var item_box02Finish = item_box02Array.map(function (element) { return Number(element); });
268
-
269
- var item_box03Finish = item_box03Array.map(function (element) { return Number(element); });
270
-
271
- var item_box03Finish = item_box03Array.map(function (element) { return Number(element); });
272
-
273
-
274
-
275
- //各カテゴリーアーカイブ表示の切り替え
276
-
277
- item_box01.each(function(){
278
-
279
- var class_box01 = $(this).attr('class');
280
-
281
- var num_box01 = Number(class_box01);
331
+ var num_box03 = Number(class_box03);
282
-
332
+
283
- if($dir3 = num_box01) {
333
+ if($dir3 = num_box03) {
284
-
334
+
285
- $('.archiveBox_item_box01 ').children("'."+$dir2+"'").addClass('active');
335
+ $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
286
-
336
+
287
- } else if($dir3 > num_box01) {
337
+ } else if($dir3 > num_box03) {
288
-
338
+
289
- $('.archiveBox_item_box01 ').children("'."+$dir2+"'").addClass('active');
339
+ $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
290
340
 
291
341
  } else {
292
342
 
293
- var minValue = Math.min.apply(null, item_box01Array);
343
+ var minValue = Math.min.apply(null, item_box03Array);
294
-
344
+
295
- $('.archiveBox_item_box01 ').children("'."+minValue+"'").addClass('active');
345
+ $('.archiveBox_item_box03 ').children("'."+minValue+"'").addClass('active');
296
346
 
297
347
  }
298
348
 
299
349
  });
300
350
 
301
- item_box02.each(function(){
351
+ item_box04.each(function(){
302
-
352
+
303
- var class_box02 = $(this).attr('class');
353
+ var class_box04 = $(this).attr('class');
304
-
354
+
305
- var num_box02 = Number(class_box02);
355
+ var num_box04 = Number(class_box04);
306
-
356
+
307
- if($dir3 = num_box02) {
357
+ if($dir3 = num_box04) {
308
-
358
+
309
- $('.archiveBox_item_box02 ').children("'."+$dir2+"'").addClass('active');
359
+ $('.archiveBox_item_box04 ').children("'."+$dir2+"'").addClass('active');
310
-
360
+
311
- } else if($dir3 > num_box02) {
361
+ } else if($dir3 > num_box04) {
312
-
362
+
313
- $('.archiveBox_item_box02 ').children("'."+$dir2+"'").addClass('active');
363
+ $('.archiveBox_item_box04 ').children("'."+$dir2+"'").addClass('active');
314
364
 
315
365
  } else {
316
366
 
317
- var minValue = Math.min.apply(null, item_box02Array);
367
+ var minValue = Math.min.apply(null, item_box04Array);
318
-
368
+
319
- $('.archiveBox_item_box02 ').children("'."+minValue+"'").addClass('active');
369
+ $('.archiveBox_item_box04 ').children("'."+minValue+"'").addClass('active');
320
370
 
321
371
  }
322
372
 
323
373
  });
324
374
 
325
- item_box03.each(function(){
326
-
327
- var class_box03 = $(this).attr('class');
328
-
329
- var num_box03 = Number(class_box03);
330
-
331
- if($dir3 = num_box03) {
332
-
333
- $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
334
-
335
- } else if($dir3 > num_box03) {
336
-
337
- $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
338
-
339
- } else {
340
-
341
- var minValue = Math.min.apply(null, item_box03Array);
342
-
343
- $('.archiveBox_item_box03 ').children("'."+minValue+"'").addClass('active');
344
-
345
- }
346
-
347
- });
348
-
349
- item_box03.each(function(){
350
-
351
- var class_box03 = $(this).attr('class');
352
-
353
- var num_box03 = Number(class_box03);
354
-
355
- if($dir3 = num_box03) {
356
-
357
- $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
358
-
359
- } else if($dir3 > num_box03) {
360
-
361
- $('.archiveBox_item_box03 ').children("'."+$dir2+"'").addClass('active');
362
-
363
- } else {
364
-
365
- var minValue = Math.min.apply(null, item_box03Array);
366
-
367
- $('.archiveBox_item_box03 ').children("'."+minValue+"'").addClass('active');
368
-
369
- }
370
-
371
- });
372
-
373
375
 
374
376
 
375
377
  /*----------------------------------------------------------------------------------*/
@@ -380,4 +382,6 @@
380
382
 
381
383
 
382
384
 
385
+
386
+
383
387
  ```