Javascript 如何防止手持设备在使用画布签名板时打开键盘？

我的应用程序中有一个小小的确认窗口，用户必须输入姓名和信息，然后输入签名。我的问题是，当用户输入姓名时，应用程序的焦点不会在有人使用签名板的那一刻消失，导致虚拟键盘在用户从触摸屏上松开手指的那一刻失效。这一焦点问题似乎只发生在移动设备上，也发生在android和苹果设备上

我尝试过使用JQuery和Javascript，甚至使用focus.blur和.focus（）等淘汰解决方案，但似乎没有任何效果。这就像在移动设备上点击HTML5画布一样，不会转移注意力

<div class="row">
    <div class="col-md-6">
        <form-group params="value: NameSignatory, attr: {'data-test-id':'name'}"></form-group>
        <form-group params="value: EmailSignatory, attr: {'data-test-id':'email'}"></form-group>
        <form-group params="value: SignatoryComment, attr: {'data-test-id':'comment'}"></form-group>

        <div>&nbsp;</div>
        <div>&nbsp;</div>
        <div>&nbsp;</div>
    </div>
    <div class="col-md-6">
        <div class="form-group has-feedback" data-bind="validationElement: SignatureJson">
            <label class="large">Put your signature here:</label>
            <em class="help-block" data-bind="validationMessage: SignatureJson"></em>
            <signature-pad-v2 params="json: SignatureJson, imageUrl: ImageFileUrl"></signature-pad-v2>

        </div>
    </div>
</div>

---

当用户将签名放在移动设备上时，焦点不会从文本字段中移除，一旦用户松开手指，键盘就会弹出。一个令人恼火的小麻烦。

我认为要从一个元素中移除焦点，另一个元素需要对焦。您是否尝试使组件“可聚焦”

---

尝试将属性tabindex=“0”添加到signature-pad-v2或组件生成的子元素中。

我认为，要从元素中移除焦点，另一个元素必须获得焦点。您是否尝试使组件“可聚焦”

---

尝试将属性tabindex=“0”添加到signature-pad-v2或组件生成的子元素。

如果没有完整的示例，很难说问题出在哪里，但由于您使用的是jQuery，请尝试按如下方式模糊活动元素：

$('canvas').on('mousedown', function (e) {
    document.activeElement.blur();
});

---

此外，如果它不起作用，请尝试通过添加

e.preventDefault（）来禁用默认操作
如果没有完整的示例，很难说问题出在哪里，但由于您使用的是jQuery，请尝试按如下方式模糊活动元素：

$('canvas').on('mousedown', function (e) {
    document.activeElement.blur();
});

此外，如果它不起作用，请尝试通过添加
e.preventDefault（）来禁用默认操作
我尝试将tabindex=“0”添加到画布本身，但似乎没有任何效果。我是否应该将tabindex=“0”与另一个解决方案结合使用？也许您需要将tabindex属性添加到signaturepad生成的主元素中，从而修改库。或者，您可以通过jQuery注入属性。我将其添加到我的应用程序框架的主元素中。它在桌面上运行良好（在索引之前也运行过），但由于某些原因，它在移动设备上不起作用。我尝试将tabindex=“0”添加到画布本身，但似乎没有任何作用。我是否应该将tabindex=“0”与另一个解决方案结合使用？也许您需要将tabindex属性添加到signaturepad生成的主元素中，从而修改库。或者，您可以通过jQuery注入属性。我将其添加到我的应用程序框架的主元素中。它在桌面上运行良好（在索引之前也运行过），但由于某些原因，它在移动设备上不起作用。将脚本添加到问题中。将脚本添加到问题中。