javascript - 使用 JavaScript 自动滑动，试图让滑块在不点击的情况下滑动

Question

1. 所以下面的代码使滑块在点击时滑动，但我想实现自动滑块，有人可以帮我，这样我就不需要点击，但它可以自己滑动。所以我想使用以下代码实现自动javascript滑块

           <input class="slide" type="radio" name="slider-1" id="s-1-1" /><label for="s-1-1"></label>
           <div>
               <img src="images\slide01.jpg" style="height: 110%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button-blue">Get Started</a>
               </div>
           </div>
   
           <input class="slide" type="radio" name="slider-1" id="s-1-2" /><label for="s-1-2"></label>
           <div>
               <img src="images\slide02.jpg" style="height: 110%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button-orange">Integrate Now</a>
               </div>
           </div>
   
           <input class="slide" type="radio" name="slider-1" id="s-1-3" /><label for="s-1-3"></label>
           <div>
               <img src="images\slide03.jpg" style="height: 110%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button-orange">Integrate Now</a>
               </div>
           </div>
   
           <input class="slide" type="radio" name="slider-1" id="s-1-4" /><label for="s-1-4"></label>
           <div>
               <img src="images\slide04.jpg" style="height: 110%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button-orange">Integrate Now</a>
               </div>
           </div>
   
           <input class="slide" type="radio" name="slider-1" id="s-1-5" /><label for="s-1-5"></label>
           <div>
               <img src="images\slide05.jpg" style="height: 110%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button-orange">Integrate Now</a>
               </div>
           </div>
   
           <input class="slide" type="radio" name="slider-1" id="s-1-6" checked /><label for="s-1-6"></label>
           <div>
               <img src="images\slide06.jpg" style="height: 120%" />
               <div class="content">
                   <h3>Bluhh Bluhh Bluhh</h3>
                   <p>bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh bluhh bluuhh bluhh bluhh
                       bluhh bluuhh bluhh bluhh bluhh</p>
                   <a href="#" class="button button">Publish Now</a>
               </div>
           </div>
   

   function doSlide(slider) { var id, o = slider.querySelectorAll("input.slide"), last = o.length - 1, current = slider.querySelector("input.slide:checked"); for (var i = 0; i < o.length; i++) if (o[i] === current) { id = i; 休息; } o[id >= 最后一个？0 : id + 1].click(); }

       function onSlide(e) {
           var o = e.target.parentNode;
           clearTimeout(o.autoslider);
           o.autoslider = setTimeout(function() {
               doSlide(o);
           }, 7e3);
       }
       $(function() {
           $(document).on("click", "input.slide", onSlide);
           $(".slider").each(function() {
               doSlide(this)
           });
       });
   </script>
   

标签： javascriptslider