Question

我试图在我的rails应用程序中以特定时间间隔显示一组图像。现在我正在使用javascript并从用户那里获取时间，以显示每张幻灯片之间的时间。现在我正在使用javascript的setTimeout函数，其中我试图从数据库中获取时间，即我的表名为slide。

这是我预加载图片的代码段

var preloaded = new Array();


for (var x = 0; x < 10; x++)
{
    preloaded[x]     = new Image();
    preloaded[x].src = "/images/pausch/img"+x+".gif";
}

这是我的图像更改功能片段

    function slideit(){
//if browser does not support the image object, exit.
if (!document.images)
return;
document.images.slide.src=eval("preloaded["+step+"].src");
if (step<10)
step++;
else
step=0 ;
<% @slides.each do |slide| %>
setTimeout("slideit()",'<%= slide.time.to_i %>')

    <% end %>
}

然而，图像正在变化是一些随机时间而不是根据存储的时间。有人能说什么错了？

Answer 1

尝试从函数内部删除setTimeout()调用，并在函数外的某处调用（例如）setInterval(slideit,1000)：

    ....
    document.images.slide.src = preloaded[step].src; 

    if (step<10) step++;
    else step=0;
}
setInterval(slideit,1000);

这将导致每1000毫秒调用slideit()，而不是每次调用函数时分配多个超时。

注意我还从eval()行删除了preloaded[step].src调用和一些额外的引号 - 它不会影响超时内容，但是你不应该在这里需要eval，因为数组的内容只是一个字符串（出于安全考虑，如果可以的话，最好避免使用eval()。

编辑：看到您希望每张图片都有不同的超时时间。我只需调用一次setTimeout（）：

即可

    ....
    document.images.slide.src = preloaded[step].src; 

    setTimeout(slideit,timeouts[step]);

    if (step<10) step++;
    else step=0;
}

对于此解决方案，您需要初始化名为timeouts的数组，其中每个条目timeouts[x]包含显示图像x的毫秒数。

Rails Javascript数据库疑问

1 个答案: