三星手机键盘使用 onkeyup 监听器复制字母答案

【问题标题】：Samsung mobile keyboard duplicates letters with onkeyup listener三星手机键盘使用 onkeyup 监听器复制字母
【发布时间】：2019-08-31 07:26:38
【问题描述】：

我正在编写一个简单的代码，将输入的字母转换为大写字母，然后在 keyup() 事件中将这些大写字母重新填充到输入元素。

但我遇到了一个令人困惑的问题：在我的三星手机（Galaxy Note 5）上输入字母时，我得到了如下图所示的重复字母：

以上，我使用带有越南语和谷歌浏览器的默认三星键盘。但是当我尝试将语言切换为英语时，我没有看到问题。

我进行了一些测试，结果如下：
测试 1：
三星键盘 + 越南语
Chrome / 或三星浏览器
-> 问题发生了

测试 2：
三星键盘 + 英文
Chrome / 或三星浏览器
-> 问题没有发生

测试 3：
三星键盘 + 越南语
火狐浏览器
-> 问题没有发生

测试 4：
Google 键盘 + 越南语
Chrome / 或三星浏览器
-> 问题没有发生

代码如下：

<input type="text" id="inputText">

<script>
  document.getElementById('inputText').addEventListener('keyup', function() {
    var typedLetters = this.value;
    var upperCasedLetters = typedLetters.toUpperCase();
    this.value = upperCasedLetters;
  });
</script>

我在 GitHub 上阅读了类似的问题：https://github.com/facebook/react-native/issues/11068，但直到现在我还没有找到明确的解决方案。

谁能告诉我发生了什么事？以及如何以编程方式解决此问题？

提前谢谢你！

【问题讨论】：

标签： javascript react-native samsung-mobile keyup

【解决方案1】：

为什么不使用text-transform: uppercase; ??纯 CSS 解决方案。

input {
  text-transform: uppercase;
}

&lt;input type="text" id="inputText"&gt;

【讨论】：

因为根本不符合我的要求，以上只是我的一段代码，后面还有其他的需要处理
如果是这样，您需要在帖子中提供更多详细信息。该帖子似乎在说您在将字符从小写变为大写时遇到问题。这是典型的XYProblem
补充一点，不管是什么逻辑，大写都是一种UI表示，可以通过CSS来实现。最好不要使您的代码过于复杂。 KISS
CSS 解决方案在作为我的要求之一以表单提交时不保留转换（大写）
因为这个问题很难重现，替代的解决方案是将提交前的值转换为大写。

【解决方案2】：

好的，我已经找到了如何通过应用https://stackoverflow.com/a/40111105/4006731 中描述的“密码字段”技巧来解决这个问题。

【讨论】：

【解决方案3】：

我发现自动大写为我解决了这个问题：

<input id="input" type="search" autocomplete="off" autocorrect="off" autocapitalize="characters" spellcheck="false" placeholder="Enter Text"/>

这实际上打开了键盘的大写锁定。占位符文本保持原样（大写和小写），大写不像 CSS 文本转换方法那样是“眼花缭乱”，而且比密码字段破解要简单得多。

【讨论】：