ios iPad Safari - 让键盘消失
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5937339/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
iPad Safari - Make keyboard disappear
提问by testndtv
In iPad Safari browser, when I change focus from a textbox to a dropdown, the keyboard still remains... Is there some way (maybe with Javascript) I can hide the keyboard when user blurs from the textbox?
在 iPad Safari 浏览器中，当我将焦点从文本框更改为下拉菜单时，键盘仍然保留......当用户从文本框模糊时，有什么方法（可能使用 Javascript）我可以隐藏键盘？
Indirectly speaking, I am looking for a equivalent of (but in Mobile Safari)
间接地说，我正在寻找等价物（但在 Mobile Safari 中）
[tempTextField resignFirstResponder];
回答by rdoggett
I found the solution for this at http://uihacker.blogspot.com/2011/10/javascript-hide-ios-soft-keyboard.html. Essentially, just do this (it worked for me):
我在http://uihacker.blogspot.com/2011/10/javascript-hide-ios-soft-keyboard.html找到了解决方案。基本上，只需这样做（它对我有用）：
var hideKeyboard = function() {
document.activeElement.blur();
$("input").blur();
};
回答by lucaferrario
I had iPad with iOS 5.0.1 not hiding the keyboard after successful login on my site. I solved by simply executing the javascript command
在我的网站上成功登录后，我的 iPad 和 iOS 5.0.1 没有隐藏键盘。我通过简单地执行 javascript 命令解决了
document.activeElement.blur();
after successful login and now the keyboard is correctly hidden :-)
成功登录后，现在键盘已正确隐藏:-)
回答by BLSully
I know this is a slightly older question, but I discovered the answer today for this, and the answer is embarrassingly simple... I spent way more time than I would like to admit figuring this out ;)
我知道这是一个稍微旧的问题，但我今天找到了答案，答案非常简单......我花了比我想承认的更多的时间来解决这个问题；）
To prevent showing the keyboard on:
要防止在以下位置显示键盘：
<input type="text" name="someInput" />
for when you want to do something like use a jQuery UI datepicker...
当你想做一些事情时，比如使用 jQuery UI 日期选择器......
add a readonlyattribute like so:
添加一个只读属性，如下所示：
<input type="text" name="someInput" readonly="readonly" />
If you are trying to be mindful of people with JS turned off, you could always leave off the attribute and add it in your code:
如果您想注意那些关闭 JS 的人，您可以随时关闭该属性并将其添加到您的代码中：
$('[name=someInput]').attr('readonly','readonly');
Hope this helps.
希望这可以帮助。
Here is a jsFiddle demonstrating the concept: http://jsfiddle.net/3QLBz/5/
这是一个 jsFiddle 演示这个概念：http: //jsfiddle.net/3QLBz/5/
回答by zenon
$("#txt").on("focus", function(){
$(this).blur();
});
works with jquery UI datepicker on IPad
与 iPad 上的 jquery UI datepicker 配合使用
回答by Disfigure
Natively, iPad, iPhone keyboard should disappear when the input looses focus.
当输入失去焦点时，iPad、iPhone 键盘本机应该消失。
I figured out on mobile/tablet devices that
Safari only handles click event for elements having cursor:pointerproperty.
我发现在移动/平板设备上，
Safari 只处理具有cursor:pointer属性的元素的点击事件。
I've finally added cursor:pointeron the body tag for mobile/tablet devices and it works like a charm.
我终于cursor:pointer为移动/平板设备添加了 body 标签，它就像一个魅力。
Little sample
小样
body {
@media screen and (max-width: 1024px) { // IPad breakpoint
cursor: pointer; // Fix iPhone/iPad click issue
}
}
}
回答by Pylinux
Version without jQuery:
没有 jQuery 的版本：
function hideKeyboard () {
document.activeElement.blur();
Array.prototype.forEach.call(document.querySelectorAll('input, textarea'), function(it) {
it.blur();
});
}
回答by Gerry Eng
I call .focus() on another textfield and the keyboard disappears. I'm using the Sencha touch framework, the textfield im referring to is an Ext.Text object.
我在另一个文本字段上调用 .focus() 并且键盘消失了。我正在使用 Sencha 触摸框架，我所指的文本字段是一个 Ext.Text 对象。
I know this is counter-intuitive, but it seems to work for me
我知道这违反直觉，但它似乎对我有用
回答by Ilker
Sample.views.MessageBar.getComponent(0).blur();
document.activeElement.blur();
window.focus();
Sample.views.sendMessageBar.getComponent(0).setDisabled(true);
You can use codes above. First and Forth lines are for that textfield. It works on iphone but it doesnt work on Android. I tried Iphone 3gs and samsung galaxy s2.
您可以使用上面的代码。第一行和第四行用于该文本字段。它适用于iphone，但不适用于Android。我尝试了 Iphone 3gs 和三星 Galaxy s2。
回答by Jay
According to Apple Safari documentation, when you select a dropdown (select list) the iOS dismisses the keyboard and displays native iOS select control. Make sure you use SELECT element for your dropdown list
根据 Apple Safari 文档，当您选择下拉列表（选择列表）时，iOS 会关闭键盘并显示本机 iOS 选择控件。确保为下拉列表使用 SELECT 元素
and also try adding this to your meta tags for the page
并尝试将其添加到页面的元标记中
<meta name="apple-mobile-web-app-capable" content="yes" />
