使用 onFocus 事件隐藏键盘答案

【问题标题】：Hide Keyboard with onFocus event使用 onFocus 事件隐藏键盘
【发布时间】：2023-04-05 18:12:01
【问题描述】：

我知道这听起来有点令人困惑，但我有一个 Angular 应用程序，它应该只能在带有条形码阅读器的移动设备上运行，它会自动将它读取的内容写入聚焦的输入字段中。我设置了应用程序，以便在加载页面时我的输入字段具有焦点，并且我希望软键盘不可见，因此用户无法在此字段中手动写入。

流程应该是这样的：输入 -> 自动对焦 -> (onFocus)="hideKeyboard()"

Autofocus 是一个自定义指令，将 dom 元素设置为 ngOnInit 中的焦点。

提前感谢您的任何提示。

【问题讨论】：

如果用户不能输入，为什么会有输入框？使该字段成为仅显示条形码的变量。
因为必须用条形码阅读器读取的内容填充字段，这是一种硬件功能，可以自动将内容写入焦点字段内，这不是我控制的行为。我不希望用户能够修改它，只需点击启动扫描的硬件按钮，然后他点击禁用按钮说“确定”。我想要这样，这样人类用户就不会在点击“ok”之前不小心按下一个键并修改条形码内容。
您可以将该字段设为只读或禁用。
readonly 不允许我编辑它，并且 disabled 不会隐藏键盘。
如果你放<input (keydown)="onKeydown($event)">事件，按钮点击进入就可以了？如果没有，您可以阻止按下所有键

标签： html angular typescript

【解决方案1】：

在this project 中有一个开始，但是当您在输入之外（在按钮中）单击时失去焦点并且键盘再次被隐藏。但是，这只是一个开始……

【讨论】：

防止将焦点保持在输入字段上很有趣，因为它是继续处理其他表单字段所必需的。如果该领域失去焦点，整个工作就会丢失。谢谢分享！！

【解决方案2】：

试试这样的。


    <input id="id1" class="hidekeyboard"/>


    $('#id1').<input_type>({
    /* options */
    });

    $('.hidekeyboard').on('focus',function(){
    $(this).trigger('blur');
    });

【讨论】：