javascript - 为什么我的幻灯片放映 JavaScript 不起作用?

标签 javascript html css

我使用了一些 html、css 和 Javascript 来创建幻灯片。我在 Youtube 上找到了这个教程,它适合我使用。我在 Stack Overflow 上搜索了这个问题,显然有人使用了完全相同的代码。我的情况与该问题不同,因此这不是重复的。但只执行 css,而不执行 Javascript。有人发现这有什么问题吗?

这是我的 html 和 css

<img id = "myPhoto" src="img1.JPG" alt= "">
<scipt src = "script.js"> </scipt>

#myPhoto{
  margin: 20px 10%;
  width: 80%;
  height: 600px;
}

这是我的 JavaScript

var myImage = document.getElementById("myPhoto");

var imageArray = ["img1.JPG", "img2.JPG"];

var imageIndex = 0;

function changeImage() {
  myPhoto.setAttribute("src" , imageArray [ imageIndex]);
  imageIndex++;
  if (imageIndex >= imageArray.length) {
    imageIndex = 0;
  }
}

var intervalHandle = setInterval(changeImage, 2000);

myPhoto.onclick = function() {
  clearInterval(intervalHandle);
}

最佳答案

一切正常,那么问题出在哪里呢?

var myImage = document.getElementById("myPhoto");

var imageArray = ["http://placehold.it/150x150", "http://placehold.it/250x150"];

var imageIndex = 0;

function changeImage() {
  myPhoto.setAttribute("src" , imageArray [ imageIndex]);
  imageIndex++;
  if (imageIndex >= imageArray.length) {
    imageIndex = 0;
  }
}

var intervalHandle = setInterval(changeImage, 2000);

myPhoto.onclick = function() {
  clearInterval(intervalHandle);
}
<img id = "myPhoto" src="http://placehold.it/250x150" alt= "">

关于javascript - 为什么我的幻灯片放映 JavaScript 不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42428065/

相关文章:

javascript - 如何在javascript中保持运行总计?

javascript - 绕过框架破坏者

html - 无法应用背景渐变

javascript - 需要使用 javascript 为下拉列表创建 onChange/onSelect

html - 如何获得 :before element open-quote to be inline with div

html - 如何通过 Ctrl+F 使图像可搜索

javascript - 如何使用 request-promise-native 获得自然解决的 promise

javascript - 代码不工作::$ ("#pmhxform input:checkbox:checked").each(function() { var id= $(this).id(); });

jqueryUI 多句柄和图像作为句柄 slider

html - 添加这个插件... brain-jam