我的图片库无法正常工作 (jQuery)

Question

我正在尝试使用 jQuery 的 keypress() 函数制作画廊。第一个按键有效（我可以使用 Enter 转到下一张图片），但第二个按键什么都不做。它应该跳回第一张图片，使用 Esc 重置图库。我可能在这里犯了一些大错误。 :P

这是我的 jQuery:

var belvImg = function() {
  $(document).keypress(function(event) {
    if (event.which === 13) {
      $('.img').hide();
      $('.currentimg').show();

      var currentImg = $('.currentimg');
      var nextImg = currentImg.next();

      currentImg.removeClass('currentimg');
      nextImg.addClass('currentimg');

    } else if (event.which === 27) {
      $('.img').hide();
      var currentImg = $('.currentimg');
      currentImg.removeClass('currentimg');
      $('#firstimg').addClass('currentimg');
      $('#firstimg').show();
    }
  });
};

$(document).ready(belvImg);

#imgholder {
  margin: auto;
  width: 90%;
  height: 500px;
  border: 1px solid black;
}
#imgholder img {
  position: absolute;
  width: 800px;
  height: 450px;
  display: none;
  margin-top: 25px;
  right: 420px;
}
.currentimg {
  position: absolute;
  display: block;
}
#imgholder h2 {
  display: none;
  position: absolute;
  left: 600px;
  margin-top: 150px;
}

<div id="imgholder">
  <img id="firstimg" class="currentimg img" src="belvaros2.jpg" />
  <img class="img" src="belvaros3.jpg" />
  <img class="img" src="belvaros4.jpg" />
  <img class="img" src="belvaros5.jpg" />
  <img class="img" src="belvaros6.jpg" />
  <h2 class="img">Esc to reset!</h2>
</div>

感谢您的帮助！

Answer 1

使用keyup代替按键

  $(document).keyup(function(event) {

对我有用！

我的图片库无法正常工作 (jQuery)

My image gallery isn't working (jQuery)

html

jquery

show

hide