Question

现在，我是网络编程的新手，特别是javascript。我正在尝试编写一个脚本，用于在用户单击图像时更新网页上的图像及其文本。这是代码：

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

}

可能不是最好的方法，但这段代码最初会起作用。但是，当我单击第三个图像返回到第一个图像时，图片工作正常，但文本变为“未定义”。我一直在搜索，但我似乎无法找到任何与此代码相关的“错误”。

感谢任何帮助。

Answer 1

输入名称中的错字：

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

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

应该是

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

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

Answer 2

您将增加点击并单击2然后应用它。你应该初始化点击并点击2与-1;由于点击初始化为0，名称[++ click2]将不首先返回第二个项目。

var click = -1;

//Another click var
var click2 = -1;

也

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

应该是

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

Answer 3

您应该确保调用names和imgs的可用索引。在第三个之后，您将拨打号码4，但这未定义。

你可以这样做：

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

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

这将使数字保持在0和2之间。

发生的事情：将%除以a % b时，a中的运营商b会将其余部分归还给您。例如5 % 2 == 1。

Answer 4

你的最后一个if语句没有将click2指定为-1。将其更改为click2 = -1

通过数组时，文本变为未定义

4 个答案: