Android Nexus 和三星手机中的不同键码答案

【问题标题】：Different key-codes coming in Android Nexus and Samsung mobileAndroid Nexus 和三星手机中的不同键码
【发布时间】：2016-04-20 18:53:44
【问题描述】：

在 Ionic 应用程序中开发功能时，我在两个不同的 Android 设备上遇到了不同键码的问题。实际上，我需要在登录时开发“Pin Code Entry”的功能，用户在 5 个字段中输入整数数字。我需要确保打开了数字键盘，当用户输入一位数字时，下一个字段应该聚焦，按退格键应该清除当前字段，前一个字段应该聚焦。如果用户输入其他密钥，它不应该允许。我放置数字输入类型如下：

我通过指令应用事件（keydown && keyup）并放置逻辑以在键输入上移动下一个和上一个字段元素。但问题出在不同的浏览器上，不同的键码出现在桌面 chrome 和 chrome 上的退格键是 8，但在三星手机上，所有键都是 229。然后我用这个函数配置了229代码问题

function getKeyCode(str) {
    return str.charCodeAt(str.length - 1);
}

但我仍然面临配置除数字和退格键之外的键码的问题，例如“。”和“-”等。请帮助我设计一些关于问题或某些库等的工作（基于 Angular、Javascript 或 jQuery）。

我的指令如下：

.directive('moveNext', function() {
    return function(scope, element) {
        element.bind('keydown', function(e) {
            console.log('down' + this.value)
            element[0].value = '';
        });

        function getKeyCode(str) {
            return str.charCodeAt(str.length - 1);
        }

        element.bind('keyup', function(e) {
            var kCd = e.keyCode || e.which;
            console.log(kCd)
            if (kCd == 0 || kCd == 229) { //for android chrome keycode fix
                kCd = getKeyCode(this.value);
            }
            var value = String.fromCharCode(kCd);
            console.log(e.keyCode + '==' + e.which + '==' + kCd + '==' + value + '==' + this.value)
            if (kCd == 8 || kCd == 229 || isNaN(kCd)) {
                element[0].value = value;
                var pre = prevOf(element);
                if (pre)
                    pre.focus();
                return;
            }
            if (!(kCd >= 48 && kCd <= 57) && // 0-9
                !(kCd >= 96 && kCd <= 105) // numpad 0-9
                // some more checking like arrows, delete, backspace, etc.
            ) {
                // This is not a valid key
                e.preventDefault();
                return;
            }
            element[0].value = value;
            var next = element.next();
            if (next[0])
                next[0].focus();
        });

        function prevOf(yourElement) {
            var parent = yourElement.parent();
            var children = parent.children();

            var prev;
            for (var i = 1; i < children.length; i++) {
                if (children[i] === yourElement[0]) {
                    prev = children[i - 1];
                }
            }

            return prev;
        }

    };
})

提前致谢。

【问题讨论】：

标签： javascript jquery angularjs ionic-framework

【解决方案1】：

对于退格问题，我无法为您提供帮助，但是有一个简单的解决方案可以将用户输入仅过滤为数字。您可以执行以下操作，而不是尝试解码 keyCode 并获取其值：

element.bind('keyup', function(e) {
    if(isNaN(parseInt(this.value)){
        this.value = '';
    }
}

【讨论】：