jQuery切换幻灯片不向后滑动

<div class="slider">
  <div class="slide">Slide 1</div>
  <div class="slide">Slide 2</div>
  <div class="slide">Slide 3</div>
</div>

.slider {
  width: 500px;
  height: 300px;
  overflow: hidden;
}

.slide {
  width: 500px;
  height: 300px;
  display: none;
}

$(document).ready(function() {
  // 选中幻灯片容器和幻灯片元素
  var $slider = $('.slider');
  var $slides = $('.slide');

  // 设置初始状态
  $slides.first().show();

  // 定义切换函数
  function switchSlide() {
    // 隐藏当前幻灯片
    var $currentSlide = $slides.filter(':visible');
    $currentSlide.hide();

    // 显示下一个幻灯片
    var $nextSlide = $currentSlide.next('.slide');
    if ($nextSlide.length === 0) {
      $nextSlide = $slides.first();
    }
    $nextSlide.show();
  }

  // 设置定时器，每隔一段时间切换幻灯片
  setInterval(switchSlide, 3000);
});