Javascript幻灯片选择“下一个”图像混淆

Javascript slideshow select "next" image confusion

本文关键字：下一个 图像 Javascript 选择 幻灯片      更新时间：2023-09-26

我对javascript很陌生。 以下代码工作正常。 当我单击"下一步"按钮时，幻灯片会停止它应该做什么，但是当单击以显示上一张图像时，它只显示一张图片并停止？我无法理解出了什么问题。请帮帮我

window.onload = function () {
    newImg = new Array("images/image1.jpg", "images/image2.jpg", "images/image3.jpg", "images/image4.jpg");
    var iImage = 1;
    var imgTimer = new Timer();
    imgTimer.Interval = 5000;
    imgTimer.Tick = function () {
        document.slideshow.src = newImg[iImage];
        iImage++
        if (iImage >= newImg.length) {
            iImage = 0;
        }
        document.getElementById('next').onclick = function () {
            if (iImage < newImg.length) {
                document.slideshow.src = newImg[iImage];
                iImage++
                if (iImage = newImg.length) {
                    iImage = 0;
                }
            }
            imgTimer.Stop();
        }
        document.getElementById('prev').onclick = function () {
            if (iImage > 0) {
                document.slideshow.src = newImg[iImage];
                iImage--
                if (iImage = 0) {
                    iImage = newImg.length;
                }
            }
            imgTimer.Stop();
        }

    };
    imgTimer.Start();
};

此 JavaScript 循环浏览图像，但如果用户单击下一个或上一个按钮，则自动循环将停止。

window.onload = function () {
    var newImg = ["images/image1.jpg",
                  "images/image2.jpg",
                  "images/image3.jpg",
                  "images/image4.jpg"],
        iImage = 0,
        slide = document.getElementById('slideshow'),
        next = document.getElementById('next'),
        prev = document.getElementById('prev'),
        interval = 3200,
        t = null;
    next.onclick = function () {
        iImage++;
        if (iImage >=  newImg.length) {
            iImage = 0;
        }
        slide.src = newImg[iImage];
        if (t !== null) {
            clearInterval(t);
            t = null;
        }
    };
    prev.onclick = function () {
        iImage--;
        if (iImage < 0) {
            iImage = newImg.length - 1;
        }
        slide.src = newImg[iImage];
        if (t !== null) {
            clearInterval(t);
            t = null;
        }
    };
    t = setInterval( function () {
        iImage++;
        if (iImage >= newImg.length) {
            iImage = 0;
        }
        slide.src = newImg[iImage];
    }, interval);
    slide.src = newImg[iImage];
};

这假设像这样 html： 

<input id='prev' value='prev' type='button'/> &nbsp;
<input id='next' value='next' type='button'/> <br/>
<img id='slideshow' src='' style='width:300px;'/>
相关文章：