Javascript 为什么赢了'；我的图像不会在点击时改变，即使逻辑看起来很简单？_Javascript

Javascript 为什么赢了'；我的图像不会在点击时改变，即使逻辑看起来很简单？

javascript

Javascript 为什么赢了'；我的图像不会在点击时改变，即使逻辑看起来很简单？,javascript,Javascript,我试图在单击当前图像时显示新图像。问题在于，单击img-1，它会跳转到img-3。但是，如果我删除第二个if（），它将正确转到下一个图像（img-2）这是怎么发生的？我该如何修复它 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="index.css"> <title>

我试图在单击当前图像时显示新图像。问题在于，单击

img-1

，它会跳转到

img-3

。但是，如果我删除第二个

if（）

，它将正确转到下一个图像（

img-2

）

这是怎么发生的？我该如何修复它

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="index.css">
    <title>Title</title>
</head>
<body>
<img id="the-image" onclick="clickedImage()" src="https://www.folkdeal.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/f/d/fd-ea10150-1.jpg" alt="image down"/>

<script type="text/javascript">
    let theImage = document.getElementById('the-image');

    let index = {
        "img-1" : "https://www.folkdeal.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/f/d/fd-ea10150-1.jpg",
        "img-2" : "http://image.en.yibada.com/data/images/full/66771/the-legend-of-zelda-japanese-hepburn-zeruda-no-densetsu-is-a-high-fantasy-action-adventure-video-game-series-created-by-japanese-game-designers-shigeru-miyamoto-and-takashi-tezuka.png",
        "img-3" : "https://www.geekisus.com/wp-content/uploads/2018/08/01_1575-11-400x400.jpg"
    };

    let clickedImage = () => {
        if(theImage.src === index["img-1"]) {
            theImage.src = index["img-2"];
        }

        if(theImage.src === index["img-2"]) {
            theImage.src = index["img-3"];
        }
    }
</script>
</body>
</html>


标题
让theImage=document.getElementById（'the-image'）；
let索引={
“img-1”：https://www.folkdeal.com/media/catalog/product/cache/1/image/9df78eab33525d08d6e5fb8d27136e95/f/d/fd-ea10150-1.jpg",
“img-2”：http://image.en.yibada.com/data/images/full/66771/the-legend-of-zelda-japanese-hepburn-zeruda-no-densetsu-is-a-high-fantasy-action-adventure-video-game-series-created-by-japanese-game-designers-shigeru-miyamoto-and-takashi-tezuka.png",
“img-3”：https://www.geekisus.com/wp-content/uploads/2018/08/01_1575-11-400x400.jpg"
};
让我们单击图像=（）=>{
如果（theImage.src==索引[“img-1”]）{
theImage.src=索引[“img-2”]；
}
if（theImage.src==索引[“img-2”]）{
theImage.src=索引[“img-3”]；
}
}

当您这样做时

 theImage.src = index["img-2"]

这是真的

 if(theImage.src === index["img-2"])

然后

 theImage.src = index["img-3"];

将执行，有效地跳过第二个映像。您可能希望将第二个

if

更改为

else if

尝试使用

else if