JavaScript 更改图像

标签 javascript

我有一组名为 img1、img2、img3、img4、.......、imgx 的图像。 因此,我想编写 JavaScript 代码来显示图像 img1 位于 document.onload() 处,第一次单击要更改为 img2 的图像,然后第二次单击要更改为 img3< 的图像 然后在每次单击 NEXT 按钮时与下一张图像相同。通过这种方式,我什至需要 PREVIOUS 按钮来返回到以前查看过的图像。

如何实现这个?

最佳答案

var currentImage = 1;

window.onload = function() {
    showImage();
};

document.getElementById("next").onclick = function() {
    currentImage++;
    showImage();
}

function showImage() {
    document.getElementById("image").src = "img" + currentImage + ".jpg";
}

这些是基础知识,应该可以帮助您入门。如果您在实现其余部分方面需要帮助,请询问我们您具体想要做什么以及您尝试了什么。提示,您需要处理没有“下一个”图像可显示的情况。您希望它回到开始还是不起作用?

关于JavaScript 更改图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7917722/

相关文章:

javascript - Angularjs 1.4 拦截器不工作

javascript - 如何关闭弹出窗口并将 View 模型返回到先前的 View ?

javascript - 如何求异步数据的总和?

javascript - IceCandidate 和 SDP 是静态的吗?

javascript - 添加图像到 react 组件

javascript - 将一个数组值连续复制到第二个数组值

javascript - ChartJS堆积条形图的透明间隙

javascript - 鹅毛笔模板气泡;溢出顶部的提示 : scroll

javascript - 如何允许用户使用样式自定义文本字段

javascript - FullCalendar "cannot read property ' getDay' 未定义”