首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在Javascript中,如何检测keydown和keyup事件中的大小写?

在Javascript中,如何检测keydown和keyup事件中的大小写?
EN

Stack Overflow用户
提问于 2013-04-04 17:42:11
回答 3查看 4.7K关注 0票数 4

我需要检测事件keydown和keyup中字符的大小写

代码语言:javascript
运行
复制
$('body').keydown(
    function(event) {
        var charCode = (event.which) ? event.which : event.keyCode;
        var char = String.fromCharCode(charCode);
        console.log(char + " is down pressed");
    }
);

$('body').keyup(
    function(event) {
        var charCode = (event.which) ? event.which : event.keyCode;
        var char = String.fromCharCode(charCode);
        console.log(char + " is up pressed");
    }
);

你可以在这里尝试一下:http://jsfiddle.net/8dqwW/

即使没有按下大写锁定,它也总是返回大写字母。

在这两个事件中,如何检测按下大小写的字母?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-06-10 23:26:20

keyupkeydown无法检测大小写。

只有keypress可以做到这一点!

票数 4
EN

Stack Overflow用户

发布于 2018-02-19 03:34:50

使用event.key和现代JS!

不再有数字代码了。您可以直接检查key。例如"Enter""LeftArrow""r""R""keypress""keydown""keyup"都可以工作。

代码语言:javascript
运行
复制
document.addEventListener("keypress", function (event) {
    const key = event.key;
    const keyLower = key.toLowerCase();

    // Check it is a char between A-Z, not numbers, etc.
    if (key.length !== 1 || keyLower < "a" || keyLower > "z") {
        return;
    }

    // Check for case
    const isUpperCase = (key !== keyLower);
});

您可以使用正则表达式来简化它

代码语言:javascript
运行
复制
const key = event.key;
const isLowerCaseLetter = (/[a-z]/.test(key));
const isUpperCaseLetter = (/[A-Z]/.test(key));
票数 2
EN

Stack Overflow用户

发布于 2013-04-04 17:46:01

如果字符转换为大写后仍然相同,则从一开始就是大写的:

代码语言:javascript
运行
复制
if (fromCharCode(e.which).toUpperCase() == fromCharCode(e.which))

由于jQuery对e.which进行了规范化,而keypress事件的工作方式略有不同,因此我会这样做:

代码语言:javascript
运行
复制
$('body').on({
    keypress: function(e) {
        var char = String.fromCharCode(e.which),
            isUpper = char == char.toUpperCase();
        console.log(char + ' is pressed' + (isUpper ? ' and uppercase' : ''))
    }
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/15807715

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档