Question

一旦用户提出“a”，按钮颜色将会改变，然后一旦用户释放“a”按钮，应再次改变。一旦按下字母“a”，该按钮仅改变颜色，而不是在释放时改变颜色。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>website</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
    $(document).keyup(function(event) {
        if ( event.which == 97){
            $('.button0 input').css('color', 'rgb(0, 0, 255)');
        }
    });
    $(document).keypress(function(event) {
        if ( event.which == 97){
            $('.button0 input').css('color', 'rgb(128, 0, 0)');
        }
    });
});
</script>
<style type="text/css">
.button0 input{
    position:fixed;
    left:41px;
    top:12px;
    font-family:Arial;
    font-size:8px;
    font-weight:normal;
}
</style>
<body>
    <div class="button0">
        <input type="button" style="width: 303px;height: 165px;" value="Button"/>
    </div>
</body>
</html>

Answer 1

来自.keypress()的{{3}}：

请注意，keydown和keyup提供一个代码，指示按下哪个键，而keypress指示输入了哪个字符。例如，小写的“a”将通过keydown和keyup报告为65，但按keypress报告为97。所有事件都将大写的“A”报告为65。由于这种区别，当捕获特殊键击如箭头键时，.keydown（）或.keyup（）是更好的选择。

因此，您需要在event.which == 97处理程序中将event.which == 65更改为keyup。

Answer 2

为什么在再次进行密钥更新时需要检查keyCode。如果我理解正确，那么下面的代码应该可以工作..

$(document).keyup(function(event) {
     $('.button0 input').css('color', 'rgb(0, 0, 255)');
});

DEMO此处

如果您真的想要比较键和更改颜色，那么您可以执行以下操作，

此处更新了DEMO

$(document).keydown(function(event) {
    if ( event.which == 65){
        $('.button0 input').css('color', 'rgb(128, 0, 0)');
    }
}).keyup(function(event) {   
   if ( event.which == 65){
        $('.button0 input').css('color', 'rgb(0, 0, 255)');
   }
});

链接到event.which代码列表。

Answer 3

似乎event.which在两个函数中意味着略有不同，因为这将起作用（chrome）：

$(function() {
    $(document).keyup(function(event) {
        if ( event.which == 65){
            $('.button0 input').css('color', 'rgb(0, 0, 255)');
        }
    });
    $(document).keypress(function(event) {
        if ( event.which == 97){
            $('.button0 input').css('color', 'rgb(128, 0, 0)');
        }
    });
});

也许jQuery正在规范event.which（keyup）keypress而不是{{1}}。

Answer 4

问题是，您正在聆听keyUp()函数上的错误密钥，请参阅keypress()的文档：

请注意，keydown和keyup提供了一个指示哪个键的代码按下，而按键表示输入了哪个字符。对于例如，keydown和keyup将小写的“a”报告为65，但按键按97。所有人都报告大写“A”为65 事件。由于这种区别，在捕捉特殊击键时例如箭头键，.keydown（）或.keyup（）是更好的选择。

因此，要修复代码，请将keyup事件更改为：

$(document).keyup(function(event) {
    if (event.which == 65) {
        $('.button0 input').css('color', 'rgb(0, 0, 255)');
    }
});

See it working here

jQuery KeyUp（）问题

4 个答案: