jquery - 按键期间更改按钮的颜色

Question

我想改变一个的颜色

<input type='button' class='button'>

当用鼠标单击或按 Enter 键时。

要更改鼠标单击时的颜色，我可以简单地使用以下 css

.button:active{
   background-color:#FFF;
}

对于回车键，我尝试了以下 jQuery 代码:

$('.button').keypress(function(e){
      if(e.which == 13){
          $(this).css('background-color','#FFF')
      }
  });

但这不起作用，现在按回车后背景仍然是白色。然而，我只希望背景在有人按回车键时变成白色。我怎样才能实现这个目标？

Answer 1

使用按键/按键组合来切换颜色:

$("button").keydown(function(e) {
    // Sets the color when the key is down...
    if(e.which === 13) {
    	$(this).css("background-color", "red");
    }
});
$("button").keyup(function() {
    // Removes the color when any key is lifted...
    $(this).css("background-color", "");
});

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