【问题标题】:I need a way around using they soft keyboard for mobile browsers我需要一种在移动浏览器上使用软键盘的方法
【发布时间】:2015-02-21 11:35:30
【问题描述】:

场景: 我有一个网络应用程序,我需要在一个中心位置捕获到页面的所有键控输入。我的第一个解决方案是不断地将焦点放在文本框上,以便所有焦点都通过那里。这对于桌面浏览器非常有效,但会导致移动浏览器上的软键盘始终可见的不良影响。由于我的键控输入来自外部源,因此我不希望键盘在我请求之前可见。由于没有直接的方法(我发现)可以做到这一点,我试图将持续的焦点放在不会导致键盘显示的控件上。我找不到不会导致键盘显示但会触发其中一个键事件(keydown/keyup/keypress)的控件。

有没有人建议我如何在不显示软键盘的情况下捕捉所有按键输入?

注意:如有必要,我可以为台式机和移动设备提供不同的解决方案。

感谢任何帮助!

【问题讨论】:

  • 当您说来自“外部来源”时,您是什么意思?您是否尝试过捕获不需要焦点输入的 window.keydown 事件?
  • 我的建议是有一个键盘图标,当点击它时,会将焦点带到(可能是隐藏的)文本框上,而不是始终保持焦点(至少在检测到移动浏览器时)跨度>
  • @JesseKernaghan 外部输入是连接或配对到将发送输入的移动设备的任何物理设备。通常它会使用键盘楔(虚拟键盘驱动程序)。
  • @JonathanGray 我可以随时显示键盘,这很容易。我需要一种在不显示键盘的情况下接收输入的方法,而当文本框有焦点时我不能这样做。我需要一些东西来接收不会提示键盘显示的输入。

标签: javascript angularjs html


【解决方案1】:

好的,所以答案是如此简单,我不敢相信我花了这么长时间才得到它。

如果您将文本框设为只读,则它不会显示键盘,但仍会触发键事件。这使我可以在不显示键盘的情况下接受来自外部源的输入。我还添加了一个键盘切换按钮,它只是隐藏了只读文本框并显示了常规文本框。

如果我的应用程序会有所不同,我可以添加和删除只读属性并再次应用焦点以获得相同的效果。

感谢所有回复,包括已删除的回复。

【讨论】:

  • 我不明白您想要来自呈现给用户的实际键盘以外的其他来源的键控输入 - 如果您更具体,我相信您会收到更好的输入
  • 无论如何,这听起来像是一种骇人听闻的做事方式。由于这些数据将在客户端进行处理,我真的希望您根本不打算信任这些数据(验证它)
  • “由于我的键输入来自外部源,我不希望键盘在我请求之前可见。” ...这将表明设备以外的来源。特异性不是问题,解释才是。虽然我不喜欢以这种方式“破解”它,但没有更好/可行的解决方案出现。考虑到我试图解决这个问题的替代方法,这个解决方案非常优雅!至于数据的有效性,这不是问题。只有白痴接受客户端输入而没有服务器端验证。所有服务层输入都经过服务器端验证。干杯
  • 我读了又读了你所说的,现在是第三次了,但坚持我的说法。你不够清楚(至少我自己马上就明白了)。其他建议可能适用于您的情况,但是恐怕您只是不了解如何实际实施它。如果我一开始就正确理解了你想要做的事情,我会自己解释实现。
  • 翻译问题是可以避免的,您是寻找信息的人。
【解决方案2】:
var keyedinput = "";
window.addEventListener('keydown', function(event){keyedinput += String.fromCharCode(event.keyCode)}, false);

keyedinput 将包含来自外部类似键盘的设备的键控输入内容。只需在需要时将其作为全局变量引用。如果有 enter/esc 键或“end”键(序列?),您只需检查相应的 keyCode 即可使用变量内容启动操作,而不是附加到它。

【讨论】:

  • 不幸的是,虽然您的解决方案可能适用于桌面浏览器,但它在移动浏览器中屡试不爽(未命中多于命中),因为它通常不会在 web-kit 移动浏览器中触发,其中。前一个提出与您的建议非常相似的内容的人决定删除他们的评论和所有伴随的对话,这太糟糕了,因为这可能会为您节省一点时间。不过感谢您的建议!
猜你喜欢
  • 1970-01-01
  • 2022-08-22
  • 1970-01-01
  • 2011-05-11
  • 2019-02-20
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-04-13
相关资源
最近更新 更多