我正在使用 contenteditable div 来创建由移动设备查看的页面,以获取某些内容的输入。我希望当用户按下 Enter 时隐藏软键盘,而不是在 div 中按 Enter 的正常操作。我第一次尝试让它工作看起来像这样:
if event.keyCode == 13 #enter
event.preventDefault() #to prevent the normal behaviour of enter
@$("#the_editable_div").blur()
然而,这似乎不像输入那样有效。 div 失去焦点,但键盘在 iOS 或 Android 上都不会隐藏。
我也尝试过解决方案在 div contenteditable 中关闭 iPad 上的键盘 https://stackoverflow.com/questions/8949222/closing-keyboard-on-ipad-in-div-contenteditable但发现不起作用。如果我专注于另一个文本字段并在 iOS 上模糊,它仍然不会关闭键盘,而在 Android 上我发现它将键盘更改为用于常规字段的键盘,再次按 Enter 将关闭键盘,但那就是这不是在 contenteditable div 字段中按下 Enter 时立即关闭的预期行为。这对我来说似乎很奇怪,因为如果我自己点击该输入字段,然后通过 javascript 模糊它,那么键盘就会正确关闭。
有没有办法让一个可内容编辑的 div 关闭 Android 和 iOS 设备上的软键盘,当该 div 聚焦时按下 Enter 键?
这个解决方法工作正常,至少在 Android 上(我无法在 iPad 上测试):
<input type="text" id="ghostInput" style="position:absolute;top:-50px" />
<div id="myDiv" contenteditable="true" style="width:100%;height:100px;background-color:yellow"></div>
<script>
var ghostInput = document.getElementById("ghostInput");
ghostInput.onfocus = function () {
ghostInput.blur();
}
document.getElementById("myDiv").onkeydown = function (e) {
if (e.keyCode == 13) ghostInput.focus();
}
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)