html - 使上一个/下一个按钮适用于 iOS 上的复选框

在 iOS 上，当在网页上填写表单时，键盘上有 Next 和 Previous 按钮，其作用类似于真实键盘上的 Tab 键。我们有一个 Web 应用程序，我使用 PhoneGap 将其实现为一个应用程序，并且 Next 和 Previous 按钮跳过复选框，就好像它们不存在一样。

有没有什么方法可以在 iOS 上使用 PhoneGap/UIWebView/Safari 使 Next 和 Previous 按钮与复选框一起使用？

---

Best Answer-推荐答案

这可以仅使用 HTML 来模拟。

在复选框之前插入一个文本输入元素。添加 JavaScript，以便当输入具有焦点时按下某个键会更改复选框状态。

这里是 a jsbin example你可以edit the source .关于此示例的说明:

• 不要使用

  - 使用长按输入强制选择文本 - 在 jsbin 的编辑模式下关闭 iOS 6(必须与 jsbin 代码或 iframe 进行一些交互)，并始终隐藏插入符号(这在这种情况下听起来很有用，但不是!)。在我看来是因为 Safari 的一个错误错误(但我并没有真正研究它，也没有报告它，因为太麻烦了。)

• 使用 元素的 visibility:hidden; 想法不起作用，因为如果用户触摸选项，则键盘会隐藏。

• 我并没有花太多时间为重点复选框寻找一种好的样式 - 如果有人想出更好的东西，请发表评论。

• 在 jsbin 示例中有一些垃圾内容，这些想法无法隐藏闪烁的插入符号。如果有隐藏插入符号的更简洁的解决方案，我会很感兴趣。

• 需要进行一些浏览器嗅探才能将此修复应用到 iOS 设备。

• 这不是标准的 iOS UI 行为，因此在使用其他应用程序时可能会使用户感到困惑，或产生其他负面影响。 future 版本的 Mobile Safari 很容易破坏解决方案。

• 我尝试了几种不同的隐藏插入符号的方法，最有效的似乎是使用 -webkit-transform: scale(0.01);变换:比例(0.01)；。使用字体大小:1px；几乎可以工作，但是当输入获得焦点时会导致 iPhone 缩放(测试 iPad iOS5 并且它没有缩放，测试 iPhone iOS6 并且它缩放)。

关于html - 使上一个/下一个按钮适用于 iOS 上的复选框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9560620/