用于 HTML 输入表单的 iOS 键盘中的 Go 与返回按钮答案

【问题标题】：Go vs. return button in iOS keyboard for HTML input forms用于 HTML 输入表单的 iOS 键盘中的 Go 与返回按钮
【发布时间】：2014-05-24 01:26:18
【问题描述】：

为 HTML <input> 表单（在 UIWebView 中使用）管理 iOS 键盘是众所周知的，例如，<input type="tel"></input> 用于电话号码。

https://developer.apple.com/library/ios/documentation/StringsTextFonts/Conceptual/TextAndWebiPhoneOS/KeyboardManagement/KeyboardManagement.html

但我想知道键盘的蓝色“开始”按钮。有时键盘有一个蓝色的“开始”按钮，有时键盘有一个灰色的返回按钮。有没有机会以编程方式控制这种行为？

【问题讨论】：

真的有办法以编程方式控制它吗？还是每个人都必须重写他们的网站？

标签： ios forms input uiwebview keyboard

【解决方案1】：

2020/2021 年更新

正如Cameron Cobb 指出的那样， Safari Mobile 从版本 13.7 到 2020 年 9 月支持新的 HTML 属性 enterkeyhint (https://caniuse.com/mdn-html_global_attributes_enterkeyhint)。

以下值是可能的 (https://mixable.blog/ux-improvements-enterkeyhint-to-define-action-label-for-the-keyboard-of-mobile-devices/)：

<input enterkeyhint="enter">
<input enterkeyhint="done">
<input enterkeyhint="go">
<input enterkeyhint="next">
<input enterkeyhint="previous">
<input enterkeyhint="search">
<input enterkeyhint="send">

原答案

啊哈……

仅当<input> 标记位于<form> 标记内（并且表单标记具有action 属性）时，才会显示“开始”按钮。因此，如果您之后使用 JavaScript 访问表单元素，则可以省略 <form> 标签。

“开始”按钮：

<form action="..." method="...">
   <input type="text"></input>
</form>

“返回”按钮：

<input type="text"></input>

【讨论】：

有什么方法可以让文本区域的 GO 按钮显示出来？
值得注意的是，enterkeyhint 需要一个环绕的 form 元素才能在 Chrome 和 Safari 上执行任何操作，并且在 Safari 上也需要表单上的 action 属性。

【解决方案2】：

重要的部分是form 标签有一个action 属性。（action="#" 是空话。）

<form>
  <input type="text" />
</form>

<form action="#">
  <input type="text" />
</form>

【讨论】：

感谢您的回答！似乎行为随着 iOS 版本而改变。原帖与 iOS 7 有关。

【解决方案3】：

有一种更好、更“直接”的方式来更改输入按钮文本。在input 标签中使用属性enterkeyhint，如下例所示。

<input enterkeyhint="go">

您可以在 Mozilla 网站 here 上找到更多文档。

【讨论】：

感谢您的精彩提示！