我如何添加'keyup‘到我的代码中，使用键盘按钮左右移动我的图库幻灯片？

<div id="slideshow">
  <img src="image1.jpg" alt="Image 1">
  <img src="image2.jpg" alt="Image 2">
  <img src="image3.jpg" alt="Image 3">
  <!-- 添加更多图片元素 -->
</div>

var currentIndex = 0; // 当前显示图片的索引
var images = document.querySelectorAll('#slideshow img'); // 获取所有图片元素

// 函数：显示指定索引的图片
function showImage(index) {
  // 隐藏所有图片
  for (var i = 0; i < images.length; i++) {
    images[i].style.display = 'none';
  }
  // 显示指定索引的图片
  images[index].style.display = 'block';
}

// 函数：切换到下一张图片
function nextImage() {
  currentIndex++;
  if (currentIndex >= images.length) {
    currentIndex = 0;
  }
  showImage(currentIndex);
}

// 函数：切换到上一张图片
function prevImage() {
  currentIndex--;
  if (currentIndex < 0) {
    currentIndex = images.length - 1;
  }
  showImage(currentIndex);
}

// 监听键盘按下事件
document.addEventListener('keydown', function(event) {
  // 检查按下的键码是否为左箭头（keyCode为37）或右箭头（keyCode为39）
  if (event.keyCode === 37) {
    prevImage();
  } else if (event.keyCode === 39) {
    nextImage();
  }
});

#slideshow {
  width: 500px; /* 设置图库幻灯片容器的宽度 */
  height: 300px; /* 设置图库幻灯片容器的高度 */
  position: relative;
  overflow: hidden;
}

#slideshow img {
  width: 100%; /* 设置幻灯片图片的宽度为容器宽度 */
  height: auto; /* 根据宽度自适应高度 */
  position: absolute;
  top: 0;
  left: 0;
  display: none;
}