Question

我正在尝试使用setInterval来更改图像，当图像更改而不是新图像时，它只显示alt文本。我是JavaScipt的新手，所以如果你有建议，请记住这一点。

＆＃13;

<html>
<head>
<script type="text/javascript">

/* <![CDATA[ */
	var changePic;
	var pic = new Array(14);
	var curPic = 0;
	pug[0] = "gallery1.jpeg";
	pug[1] = "gallery2.jpeg";
	pug[2] = "gallery3.jpeg";
	pug[3] = "gallery4.jpeg";
	pug[4] = "gallery5.jpeg";
	pug[5] = "gallery6.jpeg";
	pug[6] = "gallery7.jpeg";
	pug[7] = "gallery8.jpeg";
	pug[8] = "gallery9.jpeg";
	pug[9] = "gallery10.jpeg";
	pug[10] = "gallery11.jpeg";
	pug[11] = "gallery12.jpeg";
	pug[12] = "gallery13.jpeg";
	pug[13] = "gallery14.jpeg";

	function change(){
		if (curPic == 13)
			curPic = 0;
		else
			++curPic;
		document.images[0].src = pic[curPic];
	}

	function startChange(){
		if (changePic != null)
			clearInterval(changePic);
		changePic = setInterval("change()", 1000);
		
	}

/* ]]> */

</script>
</head>
<body>
	<img src="gallery1.jpeg" alt="gallery_pic"/>
	
	<form action="">
		<input type="button" value=" Change " onclick="startChange();" />
		<input type="button" value=" Stop " onclick="clearInterval(changePic);" />
	</form>
</body>
</html>

＆＃13;

基本上我正在尝试使用一些图像创建一个简单的幻灯片。非常感谢任何和所有帮助。

Answer 1

我认为pug应为pic，反之亦然。这是一个有效的例子：

var changePic;
var pug = new Array(14);
var curPic = 0;
pug[0] = "https://randomuser.me/api/portraits/men/1.jpg";
pug[1] = "https://randomuser.me/api/portraits/men/2.jpg";
pug[2] = "https://randomuser.me/api/portraits/men/3.jpg";
pug[3] = "https://randomuser.me/api/portraits/men/4.jpg";
pug[4] = "https://randomuser.me/api/portraits/men/5.jpg";
pug[5] = "https://randomuser.me/api/portraits/men/6.jpg";
pug[6] = "https://randomuser.me/api/portraits/men/7.jpg";
pug[7] = "https://randomuser.me/api/portraits/men/8.jpg";
pug[8] = "https://randomuser.me/api/portraits/men/9.jpg";
pug[9] = "https://randomuser.me/api/portraits/men/10.jpg";
pug[10] = "https://randomuser.me/api/portraits/men/11.jpg";
pug[11] = "https://randomuser.me/api/portraits/men/12.jpg";
pug[12] = "https://randomuser.me/api/portraits/men/13.jpg";
pug[13] = "https://randomuser.me/api/portraits/men/14.jpg";

function change(){
  if (curPic == 13)
    curPic = 0;
  else
    ++curPic;
  document.images[0].src = pug[curPic];
}

function startChange(){
  if (changePic != null)
    clearInterval(changePic);

  changePic = setInterval(change, 1000);
}

<img width="64" height="64" src="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon@2.png" alt="gallery_pic"/>

<input type="button" value="Change" onclick="startChange();" />
<input type="button" value="Stop" onclick="clearInterval(changePic);" />

Answer 2

我认为你在变量pic和pug之间错过了。所有的哈巴狗声明都应该替换为：

pug[0] = "gallery1.jpeg";

通过

pic[0] = "gallery1.jpeg";

更改图像时setInterval错误

2 个答案: