【发布时间】：2018-06-21 18:54:42
【问题描述】：
注意：由于与工作相关的更改，我无法再验证此处发布的答案。很可能，我永远无法接受下面的答案。此处发布的信息对 IMO 很有用，所以我将保持原样。如果您认为自己知道答案，请随时回答，我们会让社区决定哪些有用。
背景
我正在为 iPod Touch 开发一个standalone web app。我的要求之一是在页面加载时关注文本字段，以便用户可以连续执行任务（例如使用条形码阅读器）。
问题
问题在于它确实聚焦有问题的文本字段，但是键盘没有上去。 有解决办法吗？还是 Apple 设计的？
HTML 示例
我不确定如何将其放入代码 sn-p，但这是我一直在尝试的地方：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" href="https://cdn57.androidauthority.net/wp-content/uploads/2016/06/android-win-2-300x162.png">
<title>TESTING</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
// javascript goes here
</script>
</head>
<body>
<section id="content">
<div class="container" style="margin-top: 50px;" >
<p>Testing textfield focus</p>
<form method="POST">
<div class="row">
<div class="col-xs-12">
<input type="text" class="form-control first-responder" />
</div>
<div class="col-xs-12">
<button type="submit" class="btn" style="width: 100%" >OK</button>
</div>
</div>
</form>
</div>
</section>
</body>
</html>
我在 Safari 上查看此内容，然后将其添加到主屏幕，使其充当独立的网络应用程序。
尝试
我尝试四处寻找解决方案，第一个（我丢失了链接）建议尝试像这样的超时：
$(function () {
var firstResponder = $(".first-responder");
setTimeout(function() {
firstResponder.focus();
}, 1000);
})
我发现的另一个solutions 建议像这样设置选择范围：
$(function () {
var firstResponder = $(".first-responder");
setTimeout(function() {
firstResponder[0].setSelectionRange(0, 9999);
}, 1000);
})
There 还建议将其绑定到如下点击：
$(function () {
var firstResponder = $(".first-responder");
firstResponder.on('click', function() {
firstResponder.focus();
});
firstResponder.focus().click();
})
我也尝试过像这样触发 touchstart：
$(function () {
var firstResponder = $(".first-responder");
firstResponder.on('touchstart', function() {
firstResponder.focus();
});
firstResponder.trigger('touchstart');
})
我也尝试过像这样的简单 ajax 调用（不要介意成功/错误。我想做的只是在 ajax 调用之后专注）：
function doAjax() {
var firstResponder = $(".first-responder");
$.ajax({
url: "#",
method: "POST",
dataType: "json",
success: function(result) {
firstResponder.focus();
},
error: function(request, error) {
firstResponder.focus();
}
});
}
我有点绝望，所以我也尝试了setting some css：
user-select: text;
-webkit-user-select: text;
这些解决方案适用于 iOS 9.1（css 除外），但所有解决方案在 iOS 11.1.1 上都失败了。我尝试结合各种解决方案、设置超时等，但似乎都没有。正如我所指出的，它确实 focus 因为我可以看到文本字段的边框变为蓝色，表示它具有焦点。但是我也需要显示键盘。
此行为似乎是 bug 或 usability/security feature。如果这是设计使然（即安全功能），Apple 是否有官方文档对此进行了讨论？
附录
如果您认为条码阅读器可能是问题所在，那么事实并非如此。在我正在进行的项目中，条形码阅读器取代了本机键盘。理论上，即使没有条形码，只要我能在页面加载时调出键盘，我应该就能满足我的要求。
连续的任务是可能的，因为条形码阅读器可以在它读取的条形码之后包含一个 Enter 键，从而提交文本字段所在的表单。页面重新加载后，如果文本字段自动聚焦，用户需要做的就是读取另一个条形码。页面再次提交，重新加载，自动对焦，循环可以重复。
【问题讨论】：
-
您是使用 UIWebView 还是 WKWebView 来加载您的主页。请参考本指南：- developer.apple.com/documentation/uikit/uiwebview
-
没有。抱歉，iOS 标签可能会产生误导，但我没有使用 Obj-C 或 Xcode 进行编程。相反，我正在开发一个独立的网络应用程序。基本上是 html 和 jQuery。所以不行。不使用
UIWebView。 -
我多么希望刚刚在 iOS 上进行开发，事情可能要简单得多。我还没有尝试过，但我认为如果使用 Obj-C 开发的解决方案是通过 IB 将
UIWebView的keyboardDisplayRequiresUserAction属性设置为false。但一个人只能做梦...... -
@Keale 你是在真机还是模拟器上测试？
-
@arturdev 在真实设备上。实际上是两个设备。一个在 iOS 9 中，一个在 iOS 11 中。我手头有设备，我只是将
// javascript goes here的内容替换为此处建议的解决方案以进行检查。
标签： jquery ios mobile-safari