Question

我有一个问题，我正在尝试写一个小的javascript例程，但在盯着它几个小时后，我无法让它工作，所以它可能是微不足道的。我有一系列11个图像叫做dd0.jpg，dd1.jpg .... dd10.jpg，我正试图遍历它们，然后当我到达dd10.jpg时，过程反转然后又回到dd0.jpg

javascript代码

<script>

var ddimagearray = [];

var ddn = 0;
var incrementing = true;

for(var i =0; i<11; i++)
{
    ddimagearray[i] = new Image();
    ddimagearray[i].src =  "/dd/dd" + i + ".jpg";
}

var ddname = document.getElementById("ddimage");


var myVar = setInterval(function(){ changeimage() }, 100); // Milliseconds



function changeimage() 
{

    if (incrementing == true)
    {

        ddname.src = ddimagearray[ddn].src;

        ddn++;

        if(ddn == 14)
        {
            incrementing = false;
        }
    }
    else
    {

        ddname.src = ddimagearray[ddn].src;

        ddn--;

        if(ddn == 0)
        {
            incrementing = true;
        }

    }



}

</script>

On a test page I have <center><img src="/dd/dd0.jpg" id="ddimage" class=ddimage/></center><script src="dd.js"></script>

任何人都可以看到任何绝对的错误吗？

Answer 1

您需要在14案例中将10更改为incrementing == true，14会抛出异常Uncaught TypeError: Cannot read property 'src' of undefined，因为ddimagearray只有10个项目。

var ddimagearray = [];

var ddn = 0;
var incrementing = true;

for(var i =0; i<11; i++)
{
    ddimagearray[i] = new Image();
    ddimagearray[i].src =  "http://lorempixel.com/200/200/sports/" + i;
}

var ddname = document.getElementById("ddimage");


var myVar = setInterval(function(){ changeimage() }, 100); // Milliseconds



function changeimage() 
{

    if (incrementing == true)
    {

        ddname.src = ddimagearray[ddn].src;

        ddn++;

        if(ddn == 10)
        {
            incrementing = false;
        }
    }
    else
    {

        ddname.src = ddimagearray[ddn].src;

        ddn--;

        if(ddn == 0)
        {
            incrementing = true;
        }

    }



}

<img id="ddimage" src="http://lorempixel.com/200/200/sports/0/"/>

Answer 2

你的代码的JSFiddle运行正常（除了@jcubic发布的ddn限制当然除外）。

这是您实际代码的简化版本吗？你有任何错误吗？

您的问题可能是ddimagearray不在changeImage函数范围内，因此ddname.src = ddimagearray[ddn].src;会引发uncaught typeError。

Answer 3

在您的代码中是行：

var myVar = setInterval（function（）{changeimage（）}，100）; //毫秒

将其替换为以下内容，看看会发生什么：

var myVar = setInterval（＆＃34; changeimage（）＆＃34;，100）; //毫秒

用javascript循环遍历图像

3 个答案: