我该如何修复这个卡在第一张幻灯片上的简单javascritp幻灯片？

Question

我对编码非常陌生，在使此简单的幻灯片演示正常工作时遇到了麻烦。我认为它与javascript有关，但是我对它的理解还不是很远（由于隔离，类被暂停了）。这是我放在HTML正文中的代码：

         <script>
            var slides = document.querySelectorAll('#slides .slide');
            var currentSlide = 0;
            var slideInterval = setInterval(nextSlide,2000);

            function nextSlide(){
                slides[currentSlide].className = 'slide';
                currentSlide = (currentSlide+1)%slides.length;
                slides[currentSlide].className = 'slide showing';
        }</script>

<div id="deps">
    <ul id="slides">
        <li class="slide showing">Slide 1</li>
        <li class="slide">Slide 2</li>
        <li class="slide">Slide 3</li>
        <li class="slide">Slide 4</li>
        <li class="slide">Slide 5</li>
    </ul>
</div>

由于我什至还没有在js中编码的方式，所以我无法弄清楚这个问题。我只是从在线教程中复制了代码，但与那里不同的是，我的幻灯片卡在了第一个幻灯片上。预先感谢您的帮助！

Answer 1

我认为这可能是您的setInterval而不是像这样调用它：

setInterval(functionname,2000);

尝试这样：

setInterval(()=>{functionname()},2000);

还请确保将所有代码包装在domcontent事件监听器中：

document.addEventListener('DOMContentLoaded',()=>{ /*your javascript code*/ });