Question

我没有得到它...我的照片不会加载，它们会在同一个文件夹中

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Animal</title>
<script type="text/javascript">
var i = 0;
var timeout;
function preLoadImages()
{
if(document.images)
{
animal = new Array();
animal[0] = new Image();
anmial[0] = "bear.jpg";
animal[1] = new Image();
anmial[1] = "duck.jpg";
animal[2] = new Image();
anmial[2] = "elephant.jpg";
animal[3] = new Image();
anmial[3] = "lion.jpg";
animal[4] = new Image();
animal[4] = "cat.jpg";
}
else
alert("There are no images to load");
}
function startSlideShow()
{
if(i < animal.length)
{
document.images["animal_pic"].src = animal[i];
i++;
}
else
{
i =0;
document.images["animal_pic"].src = animal[i];
}
timeout = setTimeout('startSlideSHow()', 3000);
}
function stopSlideShow()
{
clearTimeout(timeout);
}
</script>
</head>
<body bgcolor="#FFFF00" onLoad = "preLoadImages()">
<img name="animal_pic" height="300" width="300"/>
<form>
<br/><br/>
<input type=button value="Start Show" onClick="return startSlideShow();"/>
<input type=button value="Stop Show" onClick="return stopSlideShow();"/></form>      
</body>
</html>

Answer 1

你已经创建了动物数组，但是将值存储在动物，拼写错误中，你还需要设置src属性......

错：

animal[0] = new Image();
anmial[0] = "bear.jpg";

正确：

animal[0] = new Image();
animal[0].src = "bear.jpg";

Answer 2

从我能看到的很快，你在那里错过了一个结束括号：

animal[3] = "lion.jpg";
animal[4] = new Image();
animal[4] = "cat.jpg";
} else {

您的数组名称中也存在拼写错误：

anmial[3] = ...
animal[4] = ...

在测试之前一定要保持代码整洁......

Answer 3

我已经创建了一些应该有效的代码：

(function() {

    'use strict';

    var currentImage = 0,
        imageElement,
        timer,
        images = [
        'bear.jpg',
        'duck.jpg',
        'elephant.jpg',
        'lion.jpg',
        'cat.jpg'
    ];

    var startSlideShow = function() {

        timer = window.setInterval(nextImage, 3000);
    };

    var stopSlideShow = function() {

        window.clearInterval(timer);
    };

    var nextImage = function() {

        currentImage++;

        if( currentImage == images.length ) {
            currentImage = 0;
        }

        imageElement.src = images[currentImage];
    };

    window.addEventListener('DOMContentLoaded', function() {

        imageElement = document.querySelector('img[name="animal_pic"]');
        imageElement.src = images[0];

        startSlideShow();
    });

})();

您应该执行一些基本的JavaScript教程，因为代码中存在许多错误。以下是一些建议。

// Indent your code, JUST DO IT.
var i = 0;
var timeout;
function preLoadImages() { // This function does not actually preload any images.
if(document.images) // Why would you check if there are images in the document when you're gonna load them manually anyways?
{
animal = new Array(); // Use a literal array, also use the 'var' keyword to declare a new variable.
animal[0] = new Image(); // Why would you need this now?
anmial[0] = "bear.jpg"; // I assume you meant 'animal', still why would you fill the same index again?
animal[1] = new Image(); // Same as above
anmial[1] = "duck.jpg"; // Same as above
animal[2] = new Image(); // Same as above
anmial[2] = "elephant.jpg"; // Same as above
animal[3] = new Image(); // Same as above
anmial[3] = "lion.jpg"; // Same as above
animal[4] = new Image(); // Same as above 
animal[4] = "cat.jpg"; // Same as above
}
else // Missing an opening bracket
alert("There are no images to load"); // Yes there are, regardless of document.images.
// Missing closing bracket
}
function startSlideShow()
{
if(i < animal.length) 
{
document.images["animal_pic"].src = animal[i];
i++;
}
else
{
i =0;
document.images["animal_pic"].src = animal[i];
}
timeout = setTimeout('startSlideSHow()', 3000); // This should have a function as a parameter not a string, also there is a typo.
}
function stopSlideShow()
{
clearTimeout(timeout);
}

Answer 4

  animal[4] = "cat.jpg";
    }
    else
    alert("There are no images to load");
    }
    function startSlideShow()

你有两个闭合的花括号而没有可以打开else alert(我想你要么改变要么添加一个开口

else
alert("There are no images to load");

要么打开大括号还是要摆脱它

请帮我调试这个简单的javascript？

4 个答案: