質問編集履歴
2
handleEventでのthisの参照先変更
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -8,6 +8,10 @@
|
|
|
8
8
|
|
|
9
9
|
|
|
10
10
|
|
|
11
|
+
⇒ handleEventでのthisの参照先変更
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
11
15
|
### 発生している問題・エラーメッセージ
|
|
12
16
|
|
|
13
17
|
|
1
handleEventでのthisの参照先変更
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -132,21 +132,25 @@
|
|
|
132
132
|
|
|
133
133
|
|
|
134
134
|
|
|
135
|
-
constructor(){
|
|
135
|
+
constructor( init_index = 0 ){
|
|
136
136
|
|
|
137
137
|
this.$el = $('.image_wrapper img');
|
|
138
138
|
|
|
139
|
+
this.images = [
|
|
140
|
+
|
|
139
|
-
|
|
141
|
+
'https://fakeimg.pl/350x200/ff0000/?text=1',
|
|
140
142
|
|
|
141
143
|
'https://fakeimg.pl/350x200/ff0000/000?text=2',
|
|
142
144
|
|
|
143
|
-
'https://fakeimg.pl/350x200/ff0000,128/000,255?text=3'
|
|
145
|
+
'https://fakeimg.pl/350x200/ff0000,128/000,255?text=3'
|
|
146
|
+
|
|
147
|
+
];
|
|
144
148
|
|
|
145
149
|
this.$nextBtn = $('.next');
|
|
146
150
|
|
|
147
151
|
this.$prevBtn = $('.prev');
|
|
148
152
|
|
|
149
|
-
this.index =
|
|
153
|
+
this.index = init_index;
|
|
150
154
|
|
|
151
155
|
this.handleEvent();
|
|
152
156
|
|
|
@@ -156,17 +160,35 @@
|
|
|
156
160
|
|
|
157
161
|
|
|
158
162
|
|
|
163
|
+
get Index() {
|
|
164
|
+
|
|
165
|
+
return this.index;
|
|
166
|
+
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
|
|
170
|
+
|
|
171
|
+
set Index( v ) {
|
|
172
|
+
|
|
173
|
+
this.index = v;
|
|
174
|
+
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
|
|
178
|
+
|
|
159
179
|
handleEvent() {
|
|
160
180
|
|
|
181
|
+
const self = this;
|
|
182
|
+
|
|
161
183
|
this.$nextBtn.on("click", function(){
|
|
162
184
|
|
|
163
|
-
|
|
185
|
+
self.next( self.Index );
|
|
164
186
|
|
|
165
187
|
});
|
|
166
188
|
|
|
167
189
|
this.$prevBtn.on("click", function(){
|
|
168
190
|
|
|
169
|
-
|
|
191
|
+
self.prev();
|
|
170
192
|
|
|
171
193
|
});
|
|
172
194
|
|
|
@@ -174,29 +196,29 @@
|
|
|
174
196
|
|
|
175
197
|
|
|
176
198
|
|
|
177
|
-
next(
|
|
199
|
+
next() {
|
|
178
|
-
|
|
200
|
+
|
|
179
|
-
this.index++
|
|
201
|
+
this.index++;
|
|
180
|
-
|
|
202
|
+
|
|
181
|
-
this.displayImg( index )
|
|
203
|
+
this.displayImg( this.Index );
|
|
182
|
-
|
|
204
|
+
|
|
183
|
-
}
|
|
205
|
+
}
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
206
|
+
|
|
207
|
+
|
|
208
|
+
|
|
187
|
-
prev(
|
|
209
|
+
prev() {
|
|
188
|
-
|
|
210
|
+
|
|
189
|
-
this.index--
|
|
211
|
+
this.index--;
|
|
190
|
-
|
|
212
|
+
|
|
191
|
-
this.displayImg( index )
|
|
213
|
+
this.displayImg( this.Index );
|
|
192
|
-
|
|
214
|
+
|
|
193
|
-
}
|
|
215
|
+
}
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
216
|
+
|
|
217
|
+
|
|
218
|
+
|
|
197
|
-
displayImg(
|
|
219
|
+
displayImg() {
|
|
198
|
-
|
|
220
|
+
|
|
199
|
-
this.$el.attr( 'src', this.images[ index ] );
|
|
221
|
+
this.$el.attr( 'src', this.images[ this.Index ] );
|
|
200
222
|
|
|
201
223
|
}
|
|
202
224
|
|
|
@@ -206,7 +228,7 @@
|
|
|
206
228
|
|
|
207
229
|
|
|
208
230
|
|
|
209
|
-
const Photoview_ins = new Photoview;
|
|
231
|
+
const Photoview_ins = new Photoview();
|
|
210
232
|
|
|
211
233
|
|
|
212
234
|
|