Question

我在HTML文档中嵌入了一些JavaScript代码。当我运行它时，它不会显示图像。代码附在下面，任何帮助表示赞赏。

＆＃13;

var images = new Array ("red.JPG");

function getCurrentImageIndex() {
	return images.indexOf(document.getElementById("image").src);
}

function next() {
	nextImage = (getCurrentImageIndex() + 1) % images.length;
	document.getElementById("image").src = images[nextImage];
}


function prev() {
	nextImage = (getCurrentImageIndex() - 1 + images.length) % images.length;
	document.getElementById("image").src = images[nextImage];
}

＆＃13;

<html>
  <body>
<script>
  
  //script here

</script>

<img id="image" />

<button onCLick="next()">press me</button> 

</body>  
</html>

＆＃13;

Answer 1

如果我使用绝对图像路径，则适用于我：

＆＃13;

var images = [
   "https://cdn.sstatic.net/stackoverflow/img/sprites.png", 
   "https://www.gravatar.com/avatar/06caf7997bde5d38c5aee0e051206614?s=48&d=identicon&r=PG"
];



function getCurrentImageIndex() {
	return images.indexOf(document.getElementById("image").src);
}

function next() {
	nextImage = (getCurrentImageIndex() + 1) % images.length;
	document.getElementById("image").src = images[nextImage];
}


function prev() {
	nextImage = (getCurrentImageIndex() - 1 + images.length) % images.length;
	document.getElementById("image").src = images[nextImage];
}

＆＃13;

<html>
  <body>
<script>
  
  //script here

</script>

<img id="image" />

<button onCLick="next()">press me</button> 

</body>  
</html>

＆＃13;

Answer 2

我已经快速使用您的代码创建了pen。它似乎工作。我唯一改变的是图像的网址。

var images = new Array ("http://cdn.digital.guide/2015/09/test.gif", "http://xiostorage.com/wp-content/uploads/2015/10/test.png");

由于您正在为图像使用相对网址，因此请确保它们正确无误。就像现在一样，图像应该在html文件的同一个文件夹中。

JavaScript图片显示无效

2 个答案: