在移动设备上无法检测到输入(textarea)

Question

为了检测输入按我使用简单的解决方案:

if (e.keyCode == 13) {
    // do something
}

在桌面上它适用于任何地方.在平板电脑上,智能手机 - 但是,如果涉及textarea,这不起作用.

由于很少有最新的Chrome更新,这成了一个问题.

因此,当您从移动设备按Enter键时,您只看到新行"\n",但没有执行任何功能.

那么,如何在最新的chrome版本上检测移动设备上的textarea输入？

Answer 1

虽然这可能是 Chrome 特有的错误，但这些可能是一些可能的解决方案：

1. e.which还要检查：

   var key = e.which || e.keyCode || 0;
   if (key == 13) {
       // do something
   }
   

2. 尝试不同的事件：例如，如果您正在使用keyUp，请尝试keyPress

如果这仍然不起作用，如果检测很重要，您可能需要解决方法。您可以跟踪该值并使用该input事件检测“\n”是否添加到文本区域。

var textarea = document.getElementById('your-textarea');
var textareaValue = textarea.value;
var textareaLines = getLines(textareaValue);

function getLines(str) {
    // This uses RegEx to match new lines.
    // We use || [] because it would otherwise fail if there weren't
    // any line breaks yet.

    return (str.match(/[\n\r]/g) || []).length;
}

textarea.addEventListener('input', function() {
    var newValue = textarea.value;
    var newLines = getLines(newValue);

    if (newLines > textareaLines
        && newValue.length == textareaValue.length + 1) {

        // We also check that the new length is only one
        // character longer to not fire this new line event
        // after a copy-paste with a new line character.

        doSomething();
    }

    textareaValue = newValue;
    textareaLines = newLines;
}, false);