Question

我有一个JavaScript幻灯片，只在刷新页面时更改图像。我试过添加 setInterval("printImage1()", 4000); 但后来我在另一个下方得到了多张图片。

JavaScript

NumberOfImagesToRotate1 = 10; 

FirstPart1 = '<a href="';
MiddlePart1 = '.htm"><img src="img/';
LastPart1 = '.jpg" border="0" height=”450” width="800"></a>';

function printImage1() {
var r = Math.ceil(Math.random() * NumberOfImagesToRotate1);
 document.write(FirstPart1 + r + MiddlePart1 + r + LastPart1);
}

HTML

<script>printImage1()</script;

Answer 1

如果我理解＆＃34;但是我会在彼此之下得到多个图像＆＃34;正确地，然后每隔4秒，你会得到另一张图片。

在你的HTML中你应该添加如下内容：

<div id="spaceForImage"><div>

然后，在您的javascript中，包含jQuery并将document.write(...)行替换为：

$('#spaceForImage').html(FirstPart1 + r + MiddlePart1 + r + LastPart1);

那应该做你想要的。

修改

使用Mijago的想法，你需要有类似
的东西
<a id="slideLink" href="1.htm"><img id="slideImage" src="img/q1.jpg"></img></a>
默认情况下，在您的HTML中
，然后在您的javascript中，将document.write()更改为

$('#slideLink').attr('href',r + '.htm'); $('#slideImage').attr('src','img/' + r + '.jpg');

这也很好。更少DOM，但有一行额外的代码。

带间隔的Javascript幻灯片

1 个答案: