我正在试着解决为什么在流行的移动操作系统上,在一个简单的文本区域中,似乎不可能将detect a shift+Enter个脚本组合在一起.

核心问题是:传统的Web应用程序假定按Enter键提交,并按Shift+Enter键换行,这只在Android上有问题.

基本上,代码只有以下一条:

<textarea id="my-textarea"></textarea>
var myInput = document.getElementById( 'my-textarea' );
myInput.addEventListener('keyup', function(e) {

  // if pressing "Enter"
  if( e.keyCode == 13 ) {

    // and if pressing "shift"
    if (e.shiftKey) {

        // just a new line
        // this does not work on Android
    } else {

        // submit
    }
  }
} );

正如我将要展示的,这似乎在任何浏览器but Android中都能像预期的那样工作,从来没有shiftKey到任何真正的值.

你可以使用这个很好的工具来验证自己:

https://w3c.github.io/uievents/tools/key-event-viewer.html个个个

大多数设备上的"Shift+Enter"事件表

如果我理解正确的话,这是大多数设备上假定的JavaScript事件表:

events table desktop showing that shiftLeft is activated

https://w3c.github.io/uievents/tools/key-event-viewer.html个个个

上述正确情况已在以下位置得到验证:

  • 台式机、物理键盘、Linux、Firefox 111
  • 台式机、物理键盘、Linux、Chromium 111
  • 手机,Android 11 LineageOS,虚拟键盘《黑客键盘》,带股票浏览器
  • 手机,Android 11 LineageOS,虚拟键盘《黑客键盘》,搭配Firefox 110
  • feel free to add other devices but I'm quite sure that this is the very correct behavior

Android常用键盘"Shift+Enter"事件表:BUG?

但是,在许多使用默认虚拟键盘的Android设备上,似乎没有从JavaScript中察觉到Shift+Enter键:

events table on Android showing that shiftLeft is never activated

https://w3c.github.io/uievents/tools/key-event-viewer.html个个个

上述有问题的情况转载于:

  • 移动、Android 11 LineageOS、普通键盘AOSP、Firefox 110
  • 移动、Android 11 LineageOS、股票键盘AOSP、DuckDuckGo浏览器
  • 移动、Android 11 LineageOS、股票键盘AOSP、股票浏览器

请注意,对于所有这些有问题的情况,我使用的是默认键盘(普通的Android AOSP键盘).所以它看起来真的像是一个错误,与JavaScript没有任何关系,也与我的Anyone Web开发技能没有任何关系.

如何在虚拟键盘上按Shift+Enter?

请注意,我认为大多数虚拟键盘都支持一种简单的方式来键入Shift+Enter组合键.常见示例:

  • 用一根手指按住Shift键,再用另一根手指按Enter键
  • 按两下Shift键(使其保持活动状态),然后按Enter键
  • 从Shift键拖动,在Enter键上拖放(这是一个有效的手势,例如写大写字母)

Android default virtual keyboard with left shift highlighted together with the Enter key For example here you see I double-tapped the left shift (that assumes a more-prominent color), then I pressed Enter.

这个特定的屏幕截图来自Android 11 AOSP,它没有正确发送Shift+Enter组合键.即使如你所见,它看起来就像其他任何支持Shift键的键盘一样(例如,就像iPhone的虚拟键盘一样,它可以代替它工作).

资源

问题

  1. 在这种情况下,有没有什么已知的解决办法可以建议给JavaScript程序员,以识别Android默认键盘中的Shift+Enter?
  2. 在你看来,这是安卓的一个漏洞吗?如果是,是否知道Android AOSP存在上行问题?

推荐答案

我的朋友,您的JavaScript问题很可能是not%可以通过JavaScript解决的.

这似乎与大多数安卓手机上的默认键盘有关--安卓AOSP键盘,这让你陷入了一个巨大的trap .

官方主页/源代码:

https://android.googlesource.com/platform/packages/inputmethods/LatinIME/

为什么会发生这种情况?

正如用户@padeso所说,可能根本原因是Android AOSP键盘的后端不支持多键事件,尽管它的前端看起来像.您可能有兴趣关注这篇关于Google问题跟踪器的错误报告:

https://issuetracker.google.com/issues/276611340

编辑:似乎这个问题现在被分配给了谷歌的一个人.

如何验证您的Android是否受到影响

很可能你的Android有这个键盘,所以你可能会受到影响.

无论如何,这里是如何判断你是否有这个有问题的虚拟键盘:

  1. 设置>;应用程序&>查看全部
  2. 查找"Android键盘(AOSP)"
  3. (套餐名称com.android.inputmethod.latin)

变通办法

没有检测Shift+Enter组合的JavaScript解决方案,也没有检测它的"替代事件".唯一具体的解决办法是联系你的Android用户,让他们放弃默认的AOSP键盘,安装一个"普通"的键盘,但显然,这对任何网站来说都不是一个可行的 Select .

我的意思是,你真的能指望对你网站的访问者提出这样的要求吗?"访问这个网站,更换键盘,你的网站被窃听了."这真的可以解决问题,但这是不可行的.

所以?你现在有什么建议?

目前,可能有超过10亿台安卓设备受到这个问题的影响.这不是一个JavaScript开发人员应该抗争的事情.放弃吧.

我的建议是:避免在手机上依赖这两种情况的区别.所以,要避免像"用Enter键发送"和"用Shift+Enter键添加换行符"之类的东西.在手机上,确保Enter键总是只添加一个换行符,并确保有一个专用按钮来"提交"(而不仅仅是Enter键).

Javascript相关问答推荐

将未等待的未处理的错误promise 转变为警告@ changeTicksAndRejections(由当时的抛出错误创建)

React redux状态未在React-Router库中呈现

我可以后增量超过1(最好是内联)吗?

单击按钮后未清除 Select

如何从JSON数组添加Google Maps标记—或者如何为数组添加参数到标记构造器

. NET中Unix时间转换为日期时间的奇怪行为

Angular 中的类型错误上不存在获取属性

material UI按钮组样式props 不反射

Eval vs函数()返回语义

在Matter.js中添加从点A到另一个约束的约束

如何在Svelte中从一个codec函数中调用error()?

覆盖加载器页面避免对页面上的元素进行操作

如何在JAVASCRIPT中临时删除eventListener?

如何在我的Next.js项目中.blob()我的图像文件?

如何在FastAPI中为通过file:/URL加载的本地HTML文件启用CORS?

与svg相反;S getPointAtLength(D)-我想要getLengthAtPoint(x,y)

使用父标签中的Find函数查找元素

如何在一个对象Java脚本中获取不同键的重复值?

用另一个带有类名的div包装元素

如何在Java脚本中并行运行for或任意循环的每次迭代