在 jQuery 中使用 keydown 函数隐藏和显示图像

Question

我试图在使用 jQuery 按下 'x' 键时隐藏一张图片并显示另一张图片（本质上是将它们换掉）。这是我正在尝试修复的一段代码（目前无法正常工作）：

    .keydown(function(key){
  if (key.keyCode == '88') {
      $('.ryu-still').hide();
      $('.ryu-cool').show();
 }
});

这里是完整的 .js 代码：

$(document).ready(function(){
    $('.ryu').mouseenter(function(){
        $('.ryu-still').hide();
        $('.ryu-ready').show();
    })
    .mouseleave(function() {
        $('.ryu-still').show();
        $('.ryu-ready').hide();
    })
    .mousedown(function(){
        playHadouken();
        $('.ryu-ready').hide();
        $('.ryu-throwing').show();
        $('.hadouken').finish().show().animate(
            {'left': '1020px'},
            500,
            function(){
                $(this).hide();
                $(this).css('left', '520px');
            });
    })
    .mouseup(function(){
        $('.ryu-throwing').hide();
        $('.ryu-ready').show();
    })
    .keydown(function(key){
  if (key.keyCode == '88') {
      $('.ryu-still').hide();
      $('.ryu-cool').show();
 }
});

});

function playHadouken() {
    $('#hadouken-sound')[0].volume = 0.5;
    $('#hadouken-sound')[0].load();
    $('#hadouken-sound')[0].play();
}

您可以在这里找到完整的项目：https://github.com/elisuh/jquery-streetfighter

Answer 1

他们的关键代码是一个数字（不是字符串）

看看这是否对你有帮助。

$(document).ready(function() {
  $('.ryu-ready').hide();
  
  $(document).on('keydown', function(key) {
    
    
    if (key.keyCode === 88) {
      $('.ryu-still').toggle();
      $('.ryu-ready').toggle();
    }
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="ryu-still">Still</button>
<button class="ryu-ready">Ready</button>


<div classs="ryu">show or hide</div>

Answer 2

想通了！没有意识到 number/string 的区别。以下是我的解决方案。谢谢大家

$(document).on('keydown', function(key) {
    if (key.keyCode === 88) {
      $('.ryu-still').hide();
      $('.ryu-ready').hide();
      $('.ryu-cool').show();
    }
});

在 jQuery 中使用 keydown 函数隐藏和显示图像

Hiding and showing image using keydown function in jQuery

javascript

jquery

keydown