teratail
回答率
85.35%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問infinite scroll（無限スクロール）が読み込まれない

編集履歴

質問編集履歴

5

修正

2019/09/25 06:25

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -164,7 +164,7 @@
164
164
 
165
165
  <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
166
166
 
167
- <script src="js/infinite-scroll.docs.min.js"></script>
167
+ <script src="js/infinite-scroll.pkgd.min.js"></script>
168
168
 
169
169
  <script>
170
170
 

4

修正

2019/09/25 06:25

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -308,8 +308,186 @@
308
308
 
309
309
 
310
310
 
311
+ **現在のファイル状況**
312
+
313
+ ```
314
+
315
+
316
+
317
+ <!DOCTYPE html>
318
+
319
+ <html lang="ja" dir="ltr">
320
+
321
+ <head>
322
+
323
+ <meta charset="utf-8">
324
+
325
+ <title></title>
326
+
327
+
328
+
329
+ </head>
330
+
331
+ <body>
332
+
333
+
334
+
335
+ <style>
336
+
337
+ img{
338
+
339
+ width:300px;
340
+
341
+ height:300px;
342
+
343
+ }
344
+
345
+ </style>
346
+
347
+
348
+
349
+
350
+
351
+ <div class="container">
352
+
353
+
354
+
355
+ <div class="container">
356
+
357
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
358
+
359
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
360
+
361
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
362
+
363
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
364
+
365
+ </div>
366
+
367
+
368
+
369
+ <!--<img src="images/adventure-automobile-classic-2533092.jpg">-->
370
+
371
+
372
+
373
+ <!--<img src="images/apartment-bed-bedroom-2082087.jpg">-->
374
+
375
+
376
+
377
+ <!--<img src="images/architecture-art-artistic-1702624.jpg">-->
378
+
379
+
380
+
381
+ <!--<img src="images/architecture-buildings-campus-220351.jpg">-->
382
+
383
+
384
+
385
+ <a class="pagination__next" href="/page/2">次のページへ</a>
386
+
387
+ </div><!--container-->
388
+
389
+
390
+
391
+ <!--<script src="https://unpkg.com/infinite-scroll@3/dist/infinite-scroll.pkgd.min.js"></script>-->
392
+
393
+ <script src="https://code.jquery.com/jquery-3.3.1.js"></script>
394
+
395
+ <script src="js/infinite-scroll.docs.min.js"></script>
396
+
397
+ <script>
398
+
399
+
400
+
401
+ $('.container').infiniteScroll({
402
+
403
+ // options
404
+
405
+ path: '.pagination__next',
406
+
407
+ append: '.post',
408
+
409
+ history: false,
410
+
411
+ });
412
+
413
+
414
+
415
+ </script>
416
+
417
+ </body>
418
+
419
+ </html>
420
+
421
+
422
+
423
+
424
+
425
+ ```
426
+
427
+
428
+
311
429
  ```ここに言語を入力
312
430
 
431
+ <!DOCTYPE html>
432
+
433
+ <html lang="ja" dir="ltr">
434
+
435
+ <head>
436
+
437
+ <meta charset="utf-8">
438
+
439
+ <title></title>
440
+
441
+ </head>
442
+
443
+ <body>
444
+
445
+
446
+
447
+ <style>
448
+
449
+ img{
450
+
451
+ width:300px;
452
+
453
+ height:300px;
454
+
455
+ }
456
+
457
+ </style>
458
+
459
+
460
+
461
+
462
+
463
+ <div class="container">
464
+
465
+
466
+
467
+ <div class="container">
468
+
469
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
470
+
471
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
472
+
473
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
474
+
475
+ <article class="post"><img src="https://cdn.pixabay.com/photo/2019/06/25/05/19/waterfall-4297449_1280.jpg"></article>
476
+
477
+ </div>
478
+
479
+
480
+
481
+ <a class="pagination__next" href="/page/2">次のページへ</a>
482
+
483
+
484
+
485
+ </div><!--container-->
486
+
487
+ </body>
488
+
489
+ </html>
490
+
313
491
 
314
492
 
315
493
  ```

3

修正

2019/09/25 04:14

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
  現在の状況・・・
14
14
 
15
- 「無限スクロールで次のページであるindex2.htmlファイルが自動で読み込まれまず、添付画像のように”次のページへ”とテキストが表示されます」
15
+ 「無限スクロールで次のページであるindex2.htmlファイルが自動で読み込まれまず、添付画像のように”次のページへ”とリンクテキストが表示されます」
16
16
 
17
17
 
18
18
 
@@ -303,3 +303,13 @@
303
303
 
304
304
 
305
305
  ![イメージ説明](f487e9a3ffe86b509bb7e685abb74a7e.png)
306
+
307
+
308
+
309
+
310
+
311
+ ```ここに言語を入力
312
+
313
+
314
+
315
+ ```

2

修正

2019/09/25 04:09

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -8,13 +8,25 @@
8
8
 
9
9
  【追記】
10
10
 
11
+
12
+
13
+ 現在の状況・・・
14
+
11
- 「正しく読み込まれません。」・・・次のページであるindex2.htmlファイルが読み込まれまず、そのままテキストで表示されてしまいます。
15
+ 「無限スクロールで次のページであるindex2.htmlファイルが自動で読み込まれまず、添付画像のように”次のページへ”とテキストが表示されます」
16
+
17
+
12
18
 
13
19
  ![イメージ説明](215583ac8a0ede456a34d274c5672abd.png)
14
20
 
15
21
 
16
22
 
23
+ 期待した動作・・・
24
+
17
- 期待した動作はスクロールするとindex2.htmlファイルが読み込まれることです。
25
+ スクロールするとindex2.htmlファイルが自動で読み込まれることです。
26
+
27
+
28
+
29
+
18
30
 
19
31
 
20
32
 

1

修正

2019/09/24 11:04

投稿

退会済みユーザー
test CHANGED
File without changes
test CHANGED
@@ -6,6 +6,22 @@
6
6
 
7
7
 
8
8
 
9
+ 【追記】
10
+
11
+ 「正しく読み込まれません。」・・・次のページであるindex2.htmlファイルが読み込まれまず、そのままテキストで表示されてしまいます。
12
+
13
+ ![イメージ説明](215583ac8a0ede456a34d274c5672abd.png)
14
+
15
+
16
+
17
+ 期待した動作はスクロールするとindex2.htmlファイルが読み込まれることです。
18
+
19
+
20
+
21
+
22
+
23
+
24
+
9
25
  MAMPのローカル（サーバ）環境で再現しています。
10
26
 
11
27