teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

2

追記2 for を使わず、画像要素を作る

2019/12/19 10:16

投稿

AkitoshiManabe
AkitoshiManabe

スコア5434

answer CHANGED
@@ -32,6 +32,15 @@
32
32
 
33
33
  ```javascript
34
34
 
35
+ // Array.map() で画像要素の一覧を作る。
36
+ var imgList = picList.map(function(filename){
37
+ var img = new Image();
38
+ img.src = filename;
39
+ return img;
40
+ });
41
+ console.log( imgList );
42
+
43
+
35
44
  var picIndex=0; // clickカウンタ 兼 画像ファイルインデックス
36
45
  document.getElementById("messagebox").onclick = function(){
37
46
  //document.getElementById("messagebox").innerHTML = txt++;

1

追記

2019/12/19 10:16

投稿

AkitoshiManabe
AkitoshiManabe

スコア5434

answer CHANGED
@@ -23,4 +23,24 @@
23
23
  1. どこで宣言されたものを使っているか
24
24
  2. その後の変化
25
25
 
26
- に注意しましょう。
26
+ に注意しましょう。
27
+
28
+
29
+ 追記)
30
+ コメント欄より。
31
+ クリックするたびに画像のファイル名を取り出す例です。
32
+
33
+ ```javascript
34
+
35
+ var picIndex=0; // clickカウンタ 兼 画像ファイルインデックス
36
+ document.getElementById("messagebox").onclick = function(){
37
+ //document.getElementById("messagebox").innerHTML = txt++;
38
+ //if( /*画像切り替えの条件*/ ){
39
+ picIndex++;
40
+ if( picIndex % picList.length === 0 ) {
41
+ picIndex = 0;
42
+ }
43
+ console.log( picList[picIndex] );
44
+ //}
45
+ }
46
+ ```