JavaScript幻灯片放映未按预期工作

我正在上一门计算机科学课程，并得到了制作幻灯片的具体方法的指导。我已经完全按照说明进行了操作，但是幻灯片显示不正常。它应该是这样的，当点击显示的图片时，自动幻灯片开始播放，在其他图片中移动。但是，当单击图片时，它会转到第二张图片，但不会再进一步，即使再次单击。我做错了什么？我只想通过4张图片进行幻灯片放映

实验室
var showCounter=0
var myTimeout
函数myShow（）
{if（showCounter==0）
{document.getElementById（'myPic'）.src=“希腊.jpg”
showCounter=1}
else if（showCounter==1）
{document.myPic.src=“Korea.jpg”
showCounter=2}
否则如果（showCounter==2）
{document.myPic.src=“posian.jpg”
showCounter=3}
其他的
{document.myPic.src=“Austria.jpg”
showCounter=0}
myTimeout=setTimeout（“myShow（）”，500）
}

您没有正确引用图像src。myPic从未分配到任何地方，javascript在试图查找未声明的变量时崩溃

var myPic=document.getElementById（'myPic'）

然后，您可以在需要引用元素src的任何地方使用
myPic


var showCounter=0
var myTimeout
var myPic=document.getElementById（'myPic'）；
函数myShow（）
{
如果（showCounter==0）
{
myPic.src=”https://testcreative.co.uk/wp-content/uploads/2017/10/Test-Logo-Circle-black-transparent.png"
showCounter=1
}else if（showCounter==1）{
myPic.src=”https://images.sftcdn.net/images/t_app-cover-l，f_auto/p/ce2ece60-9b32-11e6-95ab-00163ed833e7/260663710/朋友的测试乐趣截图.jpg“
显示计数器=2
}如果（showCounter==2）{myPic.src='https://d3icht40s6fxmd.cloudfront.net/sites/default/files/test-product-test.png"
显示计数器=3
}否则{
myPic.src=”https://images.fireside.fm/podcasts/images/b/bc7f1faf-8aad-4135-bb12-83a8af679756/cover_medium.jpg"
显示计数器=0
}
myTimeout=setTimeout（“myShow（）”，500）
}

实验室

不是有效的Javascript。您需要执行
document#getElementById（）
而不仅仅是
myPic
。不过，你在第一篇文章中说得对

document.getElementById('myPic').src="Greece.jpg"

首先，如上所述，您需要为all获取elementbyid，因此我建议使用一个变量来引用myPic。
除了调整图片，如果图片不显示，我会重新为“alt”赋值，否则每次都会显示默认的“Aus”

（顺便说一句，我知道你已经被指示以一种特定的方式进行幻灯片放映，但是有许多更简单的方式进行幻灯片放映，你会在网站上找到许多替代方法。）

希望这有帮助



实验室
var showCounter=0；
var pic=document.getElementById（'myPic'）；
pic.src=“Austria.jpg”；
pic.alt=“Aus”；
var-myTimeout；
函数myShow（）{
如果（showCounter==0）{
pic.src=“希腊.jpg”；
pic.alt=“希腊”
showCounter=1；
}
else if（showCounter==1）{
pic.src=“Korea.jpg”；
pic.alt=“韩国”
showCounter=2；
}
否则如果（showCounter==2）{
pic.src=“posian.jpg”；
pic.alt=“波斯尼亚”；
showCounter=3；
}
否则如果（showCounter==3）{
pic.src=“Austria.jpg”；
pic.src=“奥地利”；
showCounter=0；
}
myTimeout=setTimeout（“myShow（）”，1500）
}
使用设置超时是错误的。在这种情况下，应使用setInterval


var
showCounter=0，
images=[“希腊.jpg”，“韩国.jpg”，“波斯尼亚.jpg”，“奥地利.jpg”]，
有效期为0，
myPic_element=document.getElementById（'myPic'），
StopButton=document.getElementById（'bt_-stop'）
;
myPic_element.onclick=function（）{
clearInterval（intervalID）；
intervalID=setInterval（myShow，1000）；
}
StopButton.onclick=函数（）{
clearInterval（intervalID）；
}
函数myShow（）{
myPic_element.src=图像[showCounter]；
myPic_element.alt=images[showCounter].split（'.'）[0]；
showCounter=（showCounter+1）%images.length；
}

停止幻灯片放映
document.getElementById('myPic').src="Greece.jpg"