Văn bản trở nên không xác định khi đi qua một mảng

Question

Bây giờ, tôi mới sử dụng lập trình web, javascript nói riêng. Tôi đang cố gắng viết một tập lệnh sẽ cập nhật hình ảnh trên trang web và văn bản của nó khi người dùng nhấp vào hình ảnh. Đây là mã:

//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; 
} 

} 

Có lẽ không phải là cách tốt nhất để làm điều này, nhưng mã này sẽ hoạt động lúc đầu. Tuy nhiên, khi tôi nhấp vào hình ảnh thứ ba để quay lại hình ảnh đầu tiên, hình ảnh hoạt động tốt, nhưng văn bản sẽ trở thành 'không xác định'. Tôi đã tìm kiếm xung quanh, nhưng tôi dường như không thể tìm thấy bất cứ điều gì thực sự 'sai' với mã này.

Mọi trợ giúp đều được đánh giá cao.

Answer 1

Typo tên var:

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

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

nên

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

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

Answer 2

bạn đang thặng dư nhấp chuột và click2 sau đó áp dụng nó. bạn nên intialize nhấp vào và nhấp2 với -1; kể từ khi nhấp chuột được khởi tạo bởi 0, tên [++ click2] sẽ trả lại mục thứ hai không phải trước tiên.

var click = -1; 

//Another click var 
var click2 = -1; 

cũng

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

nên

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

Answer 3

Bạn nên đảm bảo để gọi chỉ số có sẵn của names của bạn và imgs. Sau lần thứ ba, bạn sẽ gọi số 4 và điều này không được xác định.

Bạn có thể làm theo cách này:

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

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

Điều này sẽ giữ cho các số từ 0 đến 2.

Những điều đó xảy ra: Nhà điều hành % trong a % b trả về cho bạn phần còn lại khi chia a theo b. Ví dụ: 5 % 2 == 1.

Answer 4

câu lệnh if cuối cùng của bạn không chỉ định click2 đến -1. thay đổi nó thành click2 = -1