【问题标题】:How to get keyCodes from Android mobile device keyboard?如何从 Android 移动设备键盘获取 keyCodes?
【发布时间】:2015-08-13 04:38:17
【问题描述】:

目前,我在移动设备上遇到问题。我有一个输入字段,其中只允许按下一些键:例如只有数字 0-9。它在网络浏览器上效果很好。但是当我在我的 Android 移动设备上打开它时,它失败了。

我用过keyupkeypresskeyup 正在工作,但我想知道哪个键从移动键盘触发了事件。我怎么会得到它?

【问题讨论】:

  • 您可以使用 event.keyCode 或 event.key 来获取密钥信息。试试这个:document.onkeyup = function(e){ console.log(e); }
  • 问题是移动设备中的某些键码将具有与数字相同的键码,因此它也允许使用这些键。我遇到了同样的问题,我在这里给出了答案
  • @Jugnu 当我已经尝试过这种类型的代码时。当您编写 keyCode 或 charCode 时,第一件事只会给出 229 0 结果。那么你怎么知道当前按下的是哪个键。
  • @Kushal 是的,所有浏览器都在 keypress 上提供了键码,但在 android 移动 chrome 浏览器上却没有。它只会在桌面上提供。

标签: javascript android jquery mobile keyevent


【解决方案1】:

我正在使用一个数组,该数组映射到具有给定索引处的键码的所有键盘键,然后在元素的 keydown 上我正在检查它是否允许键,因为在移动设备中某些键盘键将具有与数字相同的代码键的键码,因此它将允许该键。

所以我正在使用以下方法来防止这种情况。

//keyboard maping array   
var keyboardMap = ["", "", "", "CANCEL", "", "", "HELP", "", "BACK_SPACE", "TAB", "", "", "CLEAR", "ENTER", "RETURN", "", "SHIFT", "CONTROL", "ALT", "PAUSE", "CAPS_LOCK", "KANA", "EISU", "JUNJA", "FINAL", "HANJA", "", "ESCAPE", "CONVERT", "NONCONVERT", "ACCEPT", "MODECHANGE", "SPACE", "PAGE_UP", "PAGE_DOWN", "END", "HOME", "LEFT", "UP", "RIGHT", "DOWN", "SELECT", "PRINT", "EXECUTE", "PRINTSCREEN", "INSERT", "DELETE", "", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "COLON", "SEMICOLON", "LESS_THAN", "EQUALS", "GREATER_THAN", "QUESTION_MARK", "AT", "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z", "WIN", "", "CONTEXT_MENU", "", "SLEEP", "NUMPAD0", "NUMPAD1", "NUMPAD2", "NUMPAD3", "NUMPAD4", "NUMPAD5", "NUMPAD6", "NUMPAD7", "NUMPAD8", "NUMPAD9", "MULTIPLY", "ADD", "SEPARATOR", "SUBTRACT", "DECIMAL", "DIVIDE", "F1", "F2", "F3", "F4", "F5", "F6", "F7", "F8", "F9", "F10", "F11", "F12", "F13", "F14", "F15", "F16", "F17", "F18", "F19", "F20", "F21", "F22", "F23", "F24", "", "", "", "", "", "", "", "", "NUM_LOCK", "SCROLL_LOCK", "WIN_OEM_FJ_JISHO", "WIN_OEM_FJ_MASSHOU", "WIN_OEM_FJ_TOUROKU", "WIN_OEM_FJ_LOYA", "WIN_OEM_FJ_ROYA", "", "", "", "", "", "", "", "", "", "CIRCUMFLEX", "EXCLAMATION", "DOUBLE_QUOTE", "HASH", "DOLLAR", "PERCENT", "AMPERSAND", "UNDERSCORE", "OPEN_PAREN", "CLOSE_PAREN", "ASTERISK", "PLUS", "PIPE", "HYPHEN_MINUS", "OPEN_CURLY_BRACKET", "CLOSE_CURLY_BRACKET", "TILDE", "", "", "", "", "VOLUME_MUTE", "VOLUME_DOWN", "VOLUME_UP", "", "", "", "", "COMMA", "", "PERIOD", "SLASH", "BACK_QUOTE", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "OPEN_BRACKET", "BACK_SLASH", "CLOSE_BRACKET", "QUOTE", "", "META", "ALTGR", "", "WIN_ICO_HELP", "WIN_ICO_00", "", "WIN_ICO_CLEAR", "", "", "WIN_OEM_RESET", "WIN_OEM_JUMP", "WIN_OEM_PA1", "WIN_OEM_PA2", "WIN_OEM_PA3", "WIN_OEM_WSCTRL", "WIN_OEM_CUSEL", "WIN_OEM_ATTN", "WIN_OEM_FINISH", "WIN_OEM_COPY", "WIN_OEM_AUTO", "WIN_OEM_ENLW", "WIN_OEM_BACKTAB", "ATTN", "CRSEL", "EXSEL", "EREOF", "PLAY", "ZOOM", "", "PA1", "WIN_OEM_CLEAR", ""];
//Allowed keys as per your requirement          
var allowedKey = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "NUMPAD0", "NUMPAD1", "NUMPAD2", "NUMPAD3", "NUMPAD4", "NUMPAD5", "NUMPAD6", "NUMPAD7", "NUMPAD8", "NUMPAD9", "DELETE", "BACK_SPACE", "DECIMAL", "LEFT", "RIGHT", "TAB", "SUBTRACT", "PERIOD"];

//bind keydown to your element
element.on("keydown", function (e) {
        var key = e.charCode || e.keyCode || 0;
        var keyValue = keyboardMap[key];
        if ($.inArray(keyValue, allowedKey) !== -1){
              return true;
        }
        else{
              return  false;
        }
}

希望它对我有用,所以它也对你有用。

【讨论】:

  • 您好,请看一下:stackoverflow.com/questions/61248020/… 我无法在移动设备上检测 keyCode。谢谢!
  • 在某些安卓系统上,keyCode & which 永远是229
  • 发帖前请在相应设备上测试您的答案。要么你没有,要么从那以后,行为已经改变。正如@Hackinet 之前所述,它始终返回 229,因此您无法识别密钥。
【解决方案2】:
var input_field = document.getElementById('chatBot-input');
input_field.addEventListener('textInput', function (ev) {
  var char = ev.data; // In our example = "a"
  var keyCode = char.charCodeAt(0); // a = 97
  console.log(keyCode)
});

这肯定行得通。

【讨论】:

    猜你喜欢
    • 2018-04-14
    • 1970-01-01
    • 2012-04-22
    • 2014-02-07
    • 2014-07-14
    • 1970-01-01
    • 1970-01-01
    • 2011-06-12
    • 2011-01-14
    相关资源
    最近更新 更多