时间戳

首页 > 解决方案 > 为什么在 onkeydown 方法中返回 false 在 Android 上的 Chrome 中不起作用？

javascript - 为什么在 onkeydown 方法中返回 false 在 Android 上的 Chrome 中不起作用？

问题描述

我有一些代码在我的桌面浏览器中运行良好：

document.getElementById('oneshot-timer-input').onkeydown = function(KeyboardEvent) {

    if (KeyboardEvent.key == "Backspace") {
        data.splice(-1,1);
    } else if (KeyboardEvent.key.length == 1 && !isNaN(Number(KeyboardEvent.key))) {
        if (data.length < 6) {
            if (data.length > 0 || KeyboardEvent.key != "0") {
                data.push(KeyboardEvent.key);
            }
        }
    }

    updateInputField();
    return false;
}

输入字段的值通过以下方式在另一个函数中设置：

document.getElementById('oneshot-timer-input').value = timeOutput;

它基本上保留默认操作，并在满足某些条件时设置输入字段的值（仅接受数字和退格）。基值为00h 00m 00s。输入数字时，它会替换从右开始的零。

这在我的桌面浏览器中工作得很好，但是当我在手机上打开页面时，它会将最新的数字添加到基值的末尾，因此它会读取00h 00m 01s1例如。不过，它永远不会超过 1 个额外的数字，所以另一个例子可能是12h 34m 56s6. 我在这里缺少与 Android 相关的东西吗？

标签： javascriptkeyboard-eventsonkeydown

解决方案

所以我错过了明显的：Android 为每个键返回一个带有 keyCode 229 的未识别键，至少在查看 onkeydown 方法时是这样。

我在“textInput”上添加了另一个 EventListener，它可以完美地处理输入。但是，退格仍然是一个问题，因为这根本不会触发键事件。可悲的是，这意味着输入字段中的文本确实被删除了，但不是按照预期的那样。

执行：

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1;
if (!isAndroid) {

    document.getElementById('oneshot-timer-input').onkeydown = function(KeyboardEvent) {

        var keyCode = KeyboardEvent.keyCode;
        if (keyCode == 8 || (keyCode >= 48 && keyCode <= 57) || (keyCode >= 96 && keyCode <= 105)) {
            KeyboardEvent.preventDefault();
            handleKeyCode(KeyboardEvent.keyCode, KeyboardEvent.key);

        } else if (KeyboardEvent.key == "Escape") {
            setTimerState(TimerStateEnums.unlock, true);

        } else if (KeyboardEvent.key == "Enter") {
            document.getElementById("play-pause").checked = true;
            play_pause(document.getElementById("play-pause"));

        }
    }
} else {
    document.getElementById("oneshot-timer-input").addEventListener('textInput', function(TextEvent) {
        TextEvent.preventDefault();

        console.log(TextEvent);

        var char = TextEvent.data;
        var keyCode = char.charCodeAt(0);

        handleKeyCode(keyCode, char);

        return false;
    });
}

推荐阅读