Javascript没有运行

此javascript代码应该在单击图像时切换为html文件文件夹中某个文件夹中的图像。 到达最后一个图像后，如果再次单击，它将重置为第一个图像。 此外，在出现的图像上也有淡入淡出的效果

它不起作用，我怀疑我把路径文件写错了，并且.attr没有把第一个图像的src改成其他图像

需要记住的事情=一个非常初级的程序员，在大约2天内刚刚学会html和css，我将感谢任何帮助

代码如下：

$(document).ready(function() {
    var imageName = ["head.jpg", "head3.jpg", "head4.jpg"]; 
    var indexNum = 0;

    $("#head1").click(function() {
        $("#head1").fadeOut(300, function() {
            $("#head1").attr("src", imageName[indexNum])";
            //$(indexNum).css("height=600px,width=1000px")
            indexNum++;
            if (indexNum > 2) {    
                indexNum = 0;
            }
            $("#head1").fadeIn(500);
        )};
    )};
)};

---

你的代码中有几个错误， 在最后两行中，您交换了结尾“）”和“}”，代码中有一个“随机”

下面是一个工作示例：

$（文档）.ready（函数（）{
var imageName=[”http://placehold.it/200x200", "http://placehold.it/300x300", "http://placehold.it/400x400"]; 
var indexNum=0；
$（“#头1”）。单击（函数（）{
indexNum=（indexNum+1）%imageName.length；//这将计算0,1,2,0,1,2,0,1,2…始终在图像中循环
$（this）.fadeOut（function（）{//在本文中，它指的是#头，从DOM中反复读取它是没有效率的
$（this.attr（“src”，imageName[indexNum]）；
}).fadeIn（）；
});
})；

---

即使这一问题已经得到了解答，这里还是更正了您的原始代码

最好看看你的代码应该如何工作，而不是给出不同的代码

$(document).ready(function() {
    var imageName = ["head.jpg", "head3.jpg", "head4.jpg"]; 
    var indexNum = 0;

    $("#head1").click(function() {
        $("#head1").fadeOut(300, function() {
            $("#head1").attr("src", imageName[indexNum]);
            indexNum++;
            if (indexNum > 2) {    
                indexNum = 0;
            }
            $("#head1").fadeIn(500);
        });
    });
});

第二个版本在再次显示之前等待图像加载。。。

通过简单地使用.load，您可以等待图像加载，然后显示

$(document).ready(function() {
    var imageName = ["http://placehold.it/200x200", "http://placehold.it/300x300", "http://placehold.it/400x400"]; 
    var indexNum = 0;

    $("#head1").click(function() {
        $("#head1").fadeOut(300, function() {
            $( "#head1" ).load(function() {
                $("#head1").fadeIn(500);
              // Handler for .load() called.
            });
            $("#head1").attr("src", imageName[indexNum]);
            indexNum++;
            if (indexNum > 2) {    
                indexNum = 0;
            }
        });
    });
});

---

Jonas Grumann认为图像URL更容易用实际图像显示。

您可以使用控制台（在浏览器中按F12）调试任何脚本。您有几个语法错误。在

$（“#head1”）.attr（“src”，imageName[indexNum]”末尾的最后一个
“
的目的是什么";您的问题是，您在if语句中重置了indexNum=0，因此当您到达数组中的最后一个元素时，它会执行它假定的操作。您将索引重置为0，因此它会再次从数组中选择第一个元素。为什么人们会否决这样的问题？我会投票的。。为什么？因为软件是用来学习的。。他解释了剧本的意图，有他自己的怀疑，还说他对这部电影还不熟悉。。。为什么不投票给那些试图学习、能够在第一篇文章中解释和显示代码的人……混乱，谢谢你！我在某种程度上同意。对他来说，理解答案会更容易，但我认为我们也应该为他们指出正确的方向，以避免他养成一些坏习惯。我想这两种选择都是最好的，就像这里发生的那样。当然，但是对于这个领域的新手来说。。我喜欢对他们保持简单，这样他们就可以继续而不必理解变化。一旦他们理解了代码的工作方式。。。然后，他们要学会不同的方法和理由。但是你让我竖起大拇指，为他们展示它的简单性，不给他们超出他们需要看到的同意，他现在有两个答案一个问题-当我第一次点击第一个图像时，它会像应该的那样适当地消失，接下来，它应该从数组中加载第一张照片，但它不会加载任何内容，也无法单击使其继续运行。我尝试将数组中的图片路径切换到您使用的链接，但它仍然不会加载任何内容，而不是加载第一张图片…关于imagename=中的文件路径的问题。我可以把一个路径放在一个像images/head.jpg这样的文件夹中，而不是放一个链接，对吗？是的。。您可以链接到“folder/image.jpg”yes。。只要它与您的文件相关。。与在同一站点/pc上相同。。http://=绝对url