Jquery 如何让移动浏览器（iOS、Android中的webkit）显示其软键盘
我正在编写一个小型web应用程序，它大量使用canvas元素来执行类似于VNC的操作。它特别针对iOS和Android的默认浏览器 当需要键盘输入时，我可以通过AJAX调用进行检测，但我很难说服移动浏览器按需显示软键盘。我的想法是有一个输入字段，可能隐藏在画布后面，我可以在适当的时候关注它，然后监听输入字段上的关键事件 问题是，当它来自“后台”时，即在AJAX调用的成功处理程序上，这似乎不起作用。下面是一个自包含的测试用例（需要jQuery，并使用安装在Jquery 如何让移动浏览器（iOS、Android中的webkit）显示其软键盘,jquery,html,mobile,keyboard,mobile-safari,Jquery,Html,Mobile,Keyboard,Mobile Safari,我正在编写一个小型web应用程序，它大量使用canvas元素来执行类似于VNC的操作。它特别针对iOS和Android的默认浏览器 当需要键盘输入时，我可以通过AJAX调用进行检测，但我很难说服移动浏览器按需显示软键盘。我的想法是有一个输入字段，可能隐藏在画布后面，我可以在适当的时候关注它，然后监听输入字段上的关键事件 问题是，当它来自“后台”时，即在AJAX调用的成功处理程序上，这似乎不起作用。下面是一个自包含的测试用例（需要jQuery，并使用安装在/focus）上的虚拟ajax处理程序），
/focussetTimeout<html>
<head>
<title>Focus Test V1</title>
</head>
<script type="text/javascript" src="jquery.js"></script>
<body>
<div>
<form method="GET" onsubmit='return false;'>
<input type="text" id="kb" />
</form>
</div>
<div>
<button id="focus-direct">Focus Directly</button>
<button id="focus-timeout"">Focus Timeout</button>
<button id="focus-ajax">Focus Ajax</button>
<button id="clear">Clear</button>
</div>
<div id="console"></div>
<script type="text/javascript">
function init() {
function append(text) {
$('<div/>').text(text).appendTo('#console');
}
$('#clear').click(function() {
$('#console').html("");
});
$('#focus-direct').click(function() {
focusKB();
});
$('#focus-timeout').click(function() {
setTimeout(focusKB(), 50);
});
$('#focus-ajax').click(function() {
append("sending...");
$.ajax( {
url : '/focus',
success : function() {
append("ajax returned...");
focusKB();
}
});
});
function focusKB() {
$('#kb').focus();
append("focusing...");
}
setTimeout(focusKB, 3000);
}
$(document).ready(init);
</script>
</body>
</html>
焦点测试V1
直接聚焦
不幸的是，在大多数情况下，系统测试事件是否由用户触发（例如单击）以显示软件键盘。这使得不可能按需显示软键盘。我的实验似乎表明了这一点，但我希望有一个很好的技巧来解决这个问题。