javascript - 在 div contenteditable 中关闭 iPad 上的键盘

Question

有没有办法强制 iPad 上的键盘在 div 'contenteditable' 模糊时关闭？？

这是一个基本的 jsfiddle:http://jsfiddle.net/j_tufte/7HDmN/

我希望在用户点击按钮时关闭键盘。

非常感谢任何想法。

谢谢。

Answer 1

正如您在评论中提到的，element.blur() 不幸的是不适用于可编辑的 div。但是您可以将焦点移到实际的输入字段并立即再次将其删除:

$('#otherBox').on('click', function(){
    $('#orInput').focus().blur();
});

(这使用您的 jsFiddle HTML 代码)。

这种方法有缺点:您需要另一个输入字段(您不能将其设置为 display: hidden 或 visibility: hidden，但您可以将其设置为大小为 0 和 不透明度:0)。此外，当调用上述处理程序时， View 可能会滚动到此输入字段的位置。因此，您需要将第二个输入字段放在可编辑 div 的旁边或后面。

您还需要注意输入字段未被上一个/下一个按钮定位:将其设置为禁用。

<input id="orInput" disabled="disabled" style="width:0; height:0; opacity:0" type="text" />

对于聚焦/模糊，您需要启用该字段:

$('#otherBox').on('click', function(){
    $('#orInput').removeAttr("disabled")
                 .focus().blur().attr("disabled", "disabled");
});

但是，这绝对是一种解决方法。我还没有找到任何其他解决方案(例如，删除 contenteditable 属性不起作用)但我非常想听听其他想法。