使用 contenteditable div 时隐藏移动设备上的软键盘

2024-06-28

我正在使用 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(使用前将#替换为@)

使用 contenteditable div 时隐藏移动设备上的软键盘 的相关文章

  • td 内的文本可以随 td 一起调整大小吗? (是其高度的百分比?)

    我有一个 100 占屏幕的表格 里面有 3x3 9 个单元格 每个单元格占 33 到目前为止 一切都很好 这是一个干净 可扩展的井字棋游戏 问题在于 TD 内的文本不会随比例缩放 有没有办法说 我希望文本大小为 TD 高度的 30 或者其他
  • 如何检索所有连接的蓝牙外围设备

    我正在尝试获取所有连接到 iPhone 的外围设备的列表 我已连接 Bose Soundlink 但它没有显示在我的应用程序中 我不知道 UUID 所以传递 因为这应该得到我想的一切 func centralManagerDidUpdate
  • Android 中的发布与调试构建差异

    全部 我们面临一个奇怪的问题 我们的应用程序在调试构建变体中运行良好 但它无法在发布版本变体上正确执行 甚至奇怪的是 如果我们将发布构建变体的 debuggable 设置为 true 它就可以正常工作 Proguard 在这两个变体中都被禁
  • 检查还是不检查“IsLibrary”?

    我使用库项目 我也创建了该项目 以便在其他应用程序中重用 构建了我的应用程序 它构建得很好 但是当我尝试通过 Eclipse Ctrl F11 安装并运行它时 我得到了这个红色无法找到 MyLib apk 我的控制台中的错误行 控制台输出
  • Bootstrap 多选限制问题

    我使用创建了一个多选下拉列表引导多选 http davidstutz github io bootstrap multiselect 我需要在选项选择中设置一个限制 这里我将其设置为 5 如果达到限制 我只需禁用其他选择选项 它就可以完美工
  • 使用预先存在的数据库创建 PhoneGap iOS 应用程序

    我最近开始开发一个使用 PhoneGap 版本 2 8 0 作为药物查找器的应用程序 过去 我创建了该工具的 Web 版本 它使用 jQuery Mobile 和 PHP 来访问远程 SQL 数据库 PhoneGap 似乎是一个很有吸引力的
  • jQuery 分钟和秒倒计时器

    我想创建一个 jquery 倒计时器 我尝试了以下代码 但它不起作用 我该怎么办 DEMO https jsfiddle net tbosn210 https jsfiddle net tbosn210 var interval setIn
  • jquery mobile + PhoneGap 构建中的 Youtube iframe

    我正在使用 iframe 将 YouTube 视频嵌入到使用 jQuery mobile 和 PhoneGap 构建开发的 Android iOS 应用程序中 在我的浏览器上测试效果很好 在我的设备 android 上 我看到视频缩略图 但
  • CORS:为什么我的浏览器不发送 OPTIONS 预检请求?

    从我读到的内容来看CORS https en wikipedia org wiki Cross origin resource sharing 我理解它应该按如下方式工作 客户端的脚本尝试获取资源从服务器不同的起源 浏览器拦截这个请求并首先
  • BillingClient 始终返回 SERVICE_DISCONNECTED

    所以我有一个计费客户端 我用它实例化 billingClient BillingClient newBuilder this setListener this build 然后我打电话 billingClient startConnecti
  • 编译到模拟器时如何排除 Xcode 中的框架

    我在我的项目中包含了 TokBox 框架 这样我们就可以进行视频短信 问题是该框架以及它们所需的其他一些框架不允许您在模拟器中编译或运行该应用程序 他们不受支持 有没有办法设置编译器标志以在编译到模拟器时跳过 TokBox 和其他框架 原因
  • getCompatedStyle 类似于 IE8 的 javascript 函数

    我正在尝试在 Java GWT 代码中编写一个 Javascript 函数 该函数获取以下样式的值 direction fontFamily fontSize fontSizeAdjust fontStyle fontWeight lett
  • Android 前台服务通知未显示

    我正在尝试启动前台服务 我收到服务确实启动的通知 但通知总是被抑制 我仔细检查了应用程序是否允许在我的设备上的应用程序信息中显示通知 这是我的代码 private void showNotification Intent notificat
  • 融合位置有时会停止

    我一直在开发一个跟踪用户位置的应用程序 为此 我使用了谷歌播放服务位置模块 又名融合位置 总而言之 一切正常 但有时 完全随机 我根本不再收到来自谷歌位置服务的位置更新 我的意思是 我的应用程序工作正常 但没有位置更新 不仅如此 如果我启动
  • 在滚动视图内的 ImageView 中裁剪缩放图像

    我已经做了很多努力 最后我需要帮助 谢谢 目标 1 如何将 imageView 放入 ScrollView 中 2 我如何在scrollView内部裁剪缩放图像 我在滚动视图中有一个 imageView 我想要缩放后裁剪图像 该图像显示在滚
  • 什么是标志变量?

    最近我遇到了标志变量 但我不知道它们的作用 我不太确定何时使用标志变量以及如何使用它 我用 Google 搜索了它 但没有任何与我的上下文 JavaScript 相关的具体示例 标记变量的定义和使用 http www javascriptk
  • 无法导出已签名的应用程序

    我有一个 Eclipse 工作区 其中包含两个 Android 应用程序和两个 Android 库 Facebook SDK 和我自己的库 当我尝试创建 APK 文件时 我有时收到错误 转换为 dalvik 格式失败 错误 1 我浏览了类似
  • 我可以为每个片段单独提供工具栏吗?如何处理导航抽屉

    在我的应用程序中 某些页面的工具栏中有自定义视图 有些片段具有透明工具栏 有些片段具有坐标布局滚动 因此 我决定为每个片段单独设置工具栏 我想知道这是否是一个好的做法 如果有人已经这样做了 请分享代码或示例 您可以在片段中使用自定义工具栏
  • Xamarin - iOS 地图上的多个多边形

    我目前正在关注this https developer xamarin com guides xamarin forms application fundamentals custom renderer map polygon map ov
  • 将画布下载为 PNG 图像[重复]

    这个问题在这里已经有答案了 当我尝试将画布下载为 PNG 图像时 浏览器会在新页面中打开该图像 但不下载它 我的下载代码 btnScaricaEtichetta click function console log Download loc

随机推荐

  • 使用 gson 将 Java 对象转换为 JSON 字符串

    我在这里找到了一些示例 说明如何将 json 转换为 java 对象 但这里我需要将 Java 对象转换为GSON 我有一个Java对象 现在我想将Java对象转换为Gson 我该如何实现这一点 请参考我的代码 Staff obj new
  • Aurora RDS 实例无法停止

    我正在尝试 Amazon Aurora 实例 但看不到停止它的选项 唯一的选项是删除和重新启动 我是不是错过了什么 编辑 2018 09 25 Amazon Aurora 现在支持停止和启动数据库集群 根据本公告 https aws ama
  • javascript 减法(-) 键码

    好的 我需要我的代码来检查减号 减号 是否被按下 如果被按下我想要弹出一个警报框 我都试过了109 and 189关键代码 但我仍然没有得到想要的结果 虽然我按 我没有收到那个警报框 JavaScript字符代码 您在按键事件期间测试的内容
  • 进行 SendInput 时调用全局低级键盘钩子。如何预防?

    我有一个用 c 编写的 win 32 应用程序 它设置低级键盘挂钩 现在我想将输入发送到任何应用程序 例如单词 记事本 我该怎么做呢 我已经足够使用 findwindow sendmessage 了 对于所有这些 我需要了解编辑控件 找到编
  • Python Decimal 模块不适用于 uint64

    我正在尝试将 numpy uint64 由 numpy sum 输出 转换为小数 而不会丢失 Decimal 模块的精度 gt gt gt from decimal import Decimal gt gt gt import numpy
  • 如何在 // 注释中转义反斜杠

    我有一条以反斜杠结尾的评论 就像是 use Clang 警告我 这是多行注释 warning multi line comment Wcomment use 所以我尝试在末尾添加一些空格 但没有帮助 我可以以某种方式逃避反斜杠吗 问题的基础
  • 使用 XQuery 更新自动递增?

    Does XQuery更新支持自增属性 就像中的自增字段一样SQL 我在用着BaseX作为我的数据库 Given Christian Gr n 在 BaseX 邮件列表上的回答 https mailman uni konstanz de p
  • 为什么反斜杠出现两次?

    当我创建包含反斜杠的字符串时 它们会重复 gt gt gt my string why does it happen gt gt gt my string why does it happen Why 你所看到的是表示 of my stri
  • 在javascript中打开本地文件系统中的文件

    我正在寻找一种在 IE 和 Firefox 浏览器中使用 javascript 打开临时目录中的 xls 文件的方法 我尝试使用 JavaScript 如下所示 function openMe var newwindow window op
  • WPF 绑定无法与 int 类型的属性正常工作

    我拥有以下财产int输入我的视图模型 该模型绑定到TextBox 一切正常 TwoWay绑定工作正常 除了一种情况 如果我清除的值TextBox 属性设置器不会被调用 尽管值已被清除TextBox 属性仍保持先前的值 有人遇到过类似的问题吗
  • javascript 如何将对象深度绑定到新的“this”值

    我有一个值 它可能是一个原语或一个函数或一个递归地包含原语 函数 对象的对象 Given a theThis参数 我如何将可能在我的值内的所有函数深度绑定到theThis 我尝试过类似的东西 function deepBind o ths
  • 使用 Glide 进行缩放和遮罩

    我只是想看看是否有人可以为我指明正确的方向 以学习如何使用 Glide 来完成此任务 我们有一个包含内容的页面 内容显示为单个图像 想想 杂志页面的图像 在轻松阅读模式下 我想将第一块居中并缩放 文本内容并屏蔽其余内容 单击 下一步 时 我
  • 如何构建具有依赖关系的单元测试?

    给出以下简单示例 class MathObject object A completely superfluous class def add self a b return a b def multiply self a b result
  • T[] 和 T[*,*] 有什么区别?

    我的谷歌柔术让我失望了 问题在标题中 有什么区别T and T 我正在寻找 2 2 1 2 部分的答案 外行 或超级架构师 的简单英语解释和示例代码 链接到此区别的正式文档 额外奖励 指向定义此内容的 C 4 规范中的小节和页码 它不在第
  • Android 1.5:读取短信

    我正在为 Android 创建一个备份实用程序 我需要读取收件箱 发件箱和 dratfs 的内容 如何在 SDK v1 5 上实现这一点 有一个内容提供商 http developer android com guide topics pr
  • 如何让 PyC​​harm 识别 SQL 语句中的占位符?

    我正在使用 PyCharm 但此 SQL 语句有错误 SELECT FROM table WHERE id id s 代码语法检查说
  • React:在 TS 组件中使用 ES6 组件:TS2605:JSX 元素类型“xxx”不是 JSX 元素的构造函数

    我想在另一个 Typescript 组件中使用 ES6 React 组件 ES6 组件 class ModelViewer extends Component constructor props context super props co
  • Python套接字发生错误

    我写了这段代码 import socket host localhost port 3794 s socket socket socket AF INET socket SOCK DGRAM s setsockopt socket SOL
  • Delphi 使用 标记将 TXMLData 包装在 SOAP 请求中

    我使用 TXMLData 发送 XML Delphi 在请求中添加一个标签 我的代码如下 RequestData TXMLData Create RequestData LoadFromXML
  • 使用 contenteditable div 时隐藏移动设备上的软键盘

    我正在使用 contenteditable div 来创建由移动设备查看的页面 以获取某些内容的输入 我希望当用户按下 Enter 时隐藏软键盘 而不是在 div 中按 Enter 的正常操作 我第一次尝试让它工作看起来像这样 if eve