无法在javascript中显示图像

Unable to show images in javascript

本文关键字：显示 显示图 图像 javascript      更新时间：2023-09-26

我正在使用javascript来显示图像。我有5个图像，但无法显示它们。我的代码如下:

function set()
{
    var i;  
    for(i=1; i<=5; i++)
    {
        var image = "<img src=images/sl + i + />";  
        document.getElementById('slider').innerHTML = image;
    }
}
setInterval("set()","500");

<div id="slider">   
    <img src="images/sl1.jpg" />
</div>

Change -

var image = "<img src=images/sl + i + />";

- 

var image = "<img src=images/sl" + i + "/>";

我也认为你需要在这也附加图像格式(jpg | png etc)

编辑,

var image = "<img src=images/sl" + i +".jpg"+" style='width:500px;height:300px;' />";

你现在总是放同样的图像，循环的末尾之一。我可以提出这样的代码:

var i = 0;
function set(){
    var image = "<img src=images/sl" + i + "/>";  
    document.getElementById('slider').innerHTML = image;
    i = (i+1)%5;
}
setInterval(set, 500);

我修复了一些其他的bug/问题。永远不要将字符串作为第一个参数传递给setInterval，而是传递函数名或函数表达式。第二个需要的参数是一个数字，传递字符串字面量是没有意义的。

但是在代码的HTML部分中定义img元素并更改src属性而不是整个幻灯片内部HTML会更清晰。它还会告诉浏览器，只有在加载图像后才更改显示。

假设图像的文件名为sl1, sl2,..., sl5，则应为

var image = "<img src=images/sl"+i+"/>";

试试这个:

function set()
{
    var i;  
    for(i=1; i<=5; i++)
    {
        var image = "<img src='images/sl" + i + "'/>";  
        document.getElementById('slider').innerHTML = image;
    }
}
setInterval("set()","500");

<div id="slider">   
    <img src="images/sl1.jpg" />
</div>

您的' i '变量是字符串的一部分，您需要:

var image = "<img src=images/sl" + i + "/>";
相关文章：