質問編集履歴

2

前提・実現したいことを変更しました。

2017/08/13 02:31

投稿

mercredi
mercredi

スコア26

test CHANGED
File without changes
test CHANGED
@@ -8,7 +8,7 @@
8
8
 
9
9
  条件:
10
10
 
11
- JavaScriptとAjaxを使って画像一覧を読み込む(JQueryは使わない)
11
+ - Ajaxを使って画像一覧を読み込む(画像パスは外部ファイルのJSONに記載)
12
12
 
13
13
 
14
14
 

1

main\.jsコード

2017/08/13 02:31

投稿

mercredi
mercredi

スコア26

test CHANGED
File without changes
test CHANGED
@@ -46,9 +46,13 @@
46
46
 
47
47
 
48
48
 
49
+ var thumbnails = document.getElementById('thumbnails');
50
+
51
+
52
+
49
53
  $.ajax({
50
54
 
51
- url: 'A6_load.js',
55
+ url: 'A6_load.json',
52
56
 
53
57
  //dataType: 'text',
54
58
 
@@ -61,6 +65,8 @@
61
65
  var img;
62
66
 
63
67
  for (i = 0; i < data.files.length; i++) {
68
+
69
+ console.log(data.files[i]);
64
70
 
65
71
  li = document.createElement('li');
66
72
 
@@ -90,11 +96,57 @@
90
96
 
91
97
  'use strict';
92
98
 
99
+
100
+
101
+ var currentNum = 0;
102
+
103
+ var prev = document.getElementById('prev');
104
+
105
+ var next = document.getElementById('next');
106
+
107
+ var target = document.getElementById('target');
108
+
109
+
110
+
111
+ prev.addEventListener('click', function () {
112
+
113
+ currentNum--;
114
+
115
+ if (currentNum < 0) {
116
+
117
+ currentNum = files.length - 1;
118
+
119
+ }
120
+
121
+ console.log(files[currentNum]);
122
+
123
+ target.src = files[currentNum];
124
+
93
- ....
125
+ });
126
+
127
+
128
+
129
+ next.addEventListener('click', function () {
130
+
131
+ currentNum++;
132
+
133
+ if (currentNum > files.length - 1) {
134
+
135
+ currentNum = 0;
136
+
137
+ }
138
+
139
+ console.log(files[currentNum]);
140
+
141
+ target.src = files[currentNum];
142
+
143
+ });
94
144
 
95
145
 
96
146
 
97
147
  })();
148
+
149
+
98
150
 
99
151
  ```
100
152