配列を通過するときにテキストが定義されなくなる

Question

今、私はウェブプログラミング、特にjavascriptを初めて使い慣れました。私は、ユーザーがイメージをクリックすると、Webページ上のイメージとそのテキストを更新するスクリプトを作成しようとしています。おそらく

//Images array 
imgs = Array("test1.jpg", "test2.jpg", "test3.jpg"); 

//Names array 
names = Array("Test1", "Test2", "Test3"); 

//Holds how many times our page has been clicked 
var click = 0; 

//Another click var 
var click2 = 0; 

//change function 
function change() 
{ 

//Get the ID of 'nam', and start incrementing the elements in our array 
document.getElementById("nam").innerHTML = names[++click2]; 

//Get an element with the ID 'first', and start incrementing the elements in our  array 
document.getElementById("first").src = imgs[++click]; 

//If the user clicks to the end of the gallery 
if(click==2) 
{ 
    click = -1; 
} 

if(click2==2) 
{ 
    click = -1; 
} 

} 

これを行うための最善の方法ではありませんが、このコードは最初に動作します：ここではコードです。しかし、3番目の画像をクリックして最初の画像に戻ると、画像は正常に機能しますが、テキストは「未定義」になります。私は周りを探索しましたが、私はこのコードで本当に「間違っている」ものを見つけることはできません。

何か助けていただければ幸いです。 VAR名で

Answer 1

タイプミスは：

//If the user clicks to the end of the gallery 
if(click==2) 
{ 
    click = -1; 
} 

if(click2==2) 
{ 
    click = -1; 
} 

あなたはそれを適用するクリックしてclick2をインクリメントしている

//If the user clicks to the end of the gallery 
if(click==2) 
{ 
    click = -1; 
} 

if(click2==2) 
{ 
    click2 = -1; 
} 

Answer 2

でなければなりません。 をクリックし、-1でclick2を初期化する必要があります。クリックが0で初期化されているので、名前[++ click2]は最初のものではなく2番目の項目を返します。

var click = -1; 

//Another click var 
var click2 = -1; 

も

if(click2==2) 
{ 
    click = -1; 
} 

あなたのnamesとimgsの使用可能なインデックスを呼び出すために確保すべきである

if(click2==2) 
{ 
    click2 = -1; 
} 

Answer 3

でなければなりません。 3番目の後に、番号4と呼ばれ、これは定義されていません。あなたはそれをこのように行うことができます

：オペレータ%a % bで戻ります：

document.getElementById("nam").innerHTML = names[(++click2)%names.length];

document.getElementById("first").src = imgs[(++click)%imgs.length];

をこれが起こる0と2

物事の間の数字を維持します残りはaをbで割ったときの残りの部分です。たとえば、5 % 2 == 1です。

Answer 4

最後のif文では、click2を-1に割り当てません。それをclick2 = -1に変更してください。