使用 javascript 聚焦字段时显示 Android 软键盘
Posted
技术标签:
【中文标题】使用 javascript 聚焦字段时显示 Android 软键盘【英文标题】:Showing Android's soft keyboard when a field is .focus()'d using javascript 【发布时间】:2011-08-26 14:20:48 【问题描述】:在网页中,我有一个搜索字段。我添加了一个“清除”按钮,以便用户可以清除搜索字段并重新开始。为方便起见,我将焦点放在搜索字段的文本框上,光标确实出现在框中。然而,软键盘似乎没有出现在使用默认浏览器的 android 设备上。在 ios 和 Opera Mobile 中,它可以正常工作。
我是否可以调用其他方法使键盘显示在 Android 浏览器上,以便用户立即开始输入?
function clear_search()
if($('#searchinput').val())
$('#searchinput').val('');
$('#searchinput').focus();
【问题讨论】:
【参考方案1】:这个问题类似于 How to focus an input field on Android browser through javascript or jquery
无论如何,由于您已经有一个点击事件可以使用,这应该可以解决您的问题:
$(document).ready(function()
$('#field').click(function(e) $(this).focus(); );
$('#button').click(function(e)
$('#field').trigger('click');
);
)
当然,您确实需要触发此事件的点击事件。只是在没有事件的情况下集中注意力似乎不起作用。以上适用于我在 android 4 上的标准浏览器并显示软键盘。
【讨论】:
请注意,这似乎不适用于按键事件(这很奇怪,因为我希望在使用 tab 或 enter 键聚焦到新文本字段时,键盘会显示,因为我专注于文本字段...) 这也适用于 touchstart + touchend 事件。非常漂亮,因为您可以在 touchstart 上添加一个元素并在 touchend 上触发焦点。只要记住使用 event.stopPropagation();和 event.preventDefault();否则有时键盘会开始显示然后再次隐藏(取决于触发事件的元素下方的内容)。【参考方案2】:click()
本身不够。你需要focus()
然后click()
。如果您的脚本是由包含元素上的 onclick() 触发的,请注意无限循环。下面的脚本适用于我的 Chrome for android 58 和 Safari mobile 602.1。
var target = document.getElementsByTagName("input")[0];
if (event.target != target)
target.focus();
target.click();
【讨论】:
【参考方案3】:我不是 100% 确定,但我认为它不能通过 javascript 完成(至少在 android 2.2 之前)。如果你使用 phonegap,你可以在这里使用:https://github.com/phonegap/phonegap/wiki/How-to-show-and-hide-soft-keyboard-in-Android
【讨论】:
如果您使用最新的 Chrome,即使在 android 2.2 @user1207504 的解决方案上也有效。以上是关于使用 javascript 聚焦字段时显示 Android 软键盘的主要内容,如果未能解决你的问题,请参考以下文章
Twitter Typeahead.js:单击/聚焦时显示所有选项