JavaScript 键码答案

【问题标题】：JavaScript Key CodesJavaScript 键码
【发布时间】：2011-06-24 23:41:57
【问题描述】：

我正在使用不是我编写的 JavaScript 例程。它从文本框的onkeydown 属性调用，以防止不必要的击键。

显然没有使用第一个参数。第二个参数是应允许的字符列表。

function RestrictChars(evt, chars) {
    var key;
    var keychar;

    if (window.event)
        key = window.event.keyCode;
    else if (e)
        key = e.which;
    else
        return true;

    keychar = String.fromCharCode(key);

    if ((key == null) || (key == 0) || (key == 8) ||
        (key == 9) || (key == 13) || (key == 27))
        // Control key
        return true;
    else if (((chars).indexOf(keychar) > -1))
        return true;
    else
        return false;
}

这似乎适用于字母数字字符。但是，. 和 / 等字符会导致此函数返回 false，即使这些字符包含在 chars 参数中也是如此。例如，如果按下. 键，则key 设置为190，keychar 设置为“3/4”字符。

谁能看出这是如何工作的和/或为什么不工作？我对 JavaScript 的了解还不够，看不出它在做什么。

【问题讨论】：

您可能会发现此键代码测试实用程序有助于确定哪些事件返回各种键的哪些键代码：west-wind.com/WestwindWebToolkit/samples/Ajax/html5andCss3/…

标签： javascript keycode fromcharcode

【解决方案1】：

这有两个问题：首先，如果您正在分析输入的字符，则需要使用 keypress 事件而不是 keydown，因为这是唯一可以告诉您有关实际输入的字符。有关此事件和 JavaScript 关键事件的（更多）详细信息，请参阅http://unixpapa.com/js/key.html。其次，引用了一个名为e 的变量，它不（但应该）对应于evt 参数。

这是一个重写，假设您有一个名为 textBox 的变量引用文本输入元素。

jsFiddle：http://jsfiddle.net/9DZwL/

代码：

function isKeypressCharValid(e, chars) {
    e = e || window.event;

    // Allow delete, tab, enter and escape keys through
    if (/^(8|9|13|27)$/.test("" + e.keyCode)) {
        return true;
    }

    var charCode = (typeof e.which == "number") ? e.which : e.keyCode;
    var charTyped = String.fromCharCode(charCode);
    return chars.indexOf(charTyped) > -1;
}

textBox.onkeypress = function(evt) {
    if (!isKeypressCharValid(evt, "abc123")) {
        return false;
    }
};

【讨论】：

谢谢。这似乎行得通。我会阅读这个，但也许你可以回答几个简单的问题。 1）为什么这不能阻止退格等控制字符？ 2) || 到底在做什么？（以我的背景，|| 是逻辑或，但在这里似乎没有意义。）
@Jonathan：我只是添加了一点来处理控制字符。 JavaScript 中的|| 如果它是“真实的”（即强制转换为布尔值true），则返回第一个操作数，否则返回第二个操作数，因此可以用作条件赋值的快捷方式。
@pst：JavaScript 关键事件一团糟。我建议阅读我的答案中链接到的页面（大大优于 quirksmode 页面，IMO）或我的简短摘要：stackoverflow.com/questions/4285627/…，然后看看你是否认为我的答案是错误的。
@Ken：我概述了它不起作用的两个原因：首先，这是错误的事件，其次，有一个不正确的变量。诚然，我没有详细说明代码试图做什么，但我提供了一个资源链接，该链接非常详细地解释了 JavaScript 关键事件是如何工作的。
@Jonathah Wood：|| 确实是逻辑或。第一个if 分支中的代码表示“如果键等于空或键等于0 或”。至于你关于退格的问题，它是 key == 8 的特定测试的一部分（这是退格；9 是制表符，13 是输入（或返回），27 是转义。

【解决方案2】：

我也不是 JS 人，但是……我可以解释它应该如何工作；但是，我不知道为什么你会得到你提到的键的值。

keychar = String.fromCharCode(key);

这会检查键是否为可打印字符（字母、标点符号等）

if ((key == null) || (key == 0) || (key == 8) ||
    (key == 9) || (key == 13) || (key == 27))
    // Control key

以上检查键是否为空 OR (||)` 0 或 8（退格）或 9（制表符）或 13（0x0D 或 ENTER）或 27（0x1B 或 ESCAPE） - 这正是您期望的布尔结果：IF or or or ...

else if (((chars).indexOf(keychar) > -1))

这会检查keychar 是否在作为chars 参数传递的字符串中

【讨论】：