首页 文章

如何让移动浏览器(iOS,Android中的webkit)显示他们的软键盘

提问于
浏览
4

我正在编写一个小型的Web应用程序,它大量使用canvas元素来执行类似于VNC的操作 . 它特别适用于iOS和Android的默认浏览器 .

当需要键盘输入时,我可以通过AJAX调用检测到,但是我无法说服移动浏览器按需显示他们的软键盘 . 我的想法是有一个输入字段,可能隐藏在画布后面,我可以在适当的时候给予关注,然后在该输入字段上监听关键事件 .

问题是,当它来到"from the background"时,这似乎不起作用,即在AJAX调用的成功处理程序上 . 这是一个独立的测试用例(需要jQuery,并使用安装在 /focus 的虚拟ajax处理程序),它显示了焦点在来自 setTimeout 延迟或来自AJAX调用的返回时如何处理键盘 . 有没有办法让键盘有效弹出?

<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>

1 回答

  • 2

    不幸的是,在大多数情况下,系统测试用户是否触发事件(例如,点击)以显示软件键盘 . 这使得无法按需显示软键盘 .

相关问题