jQuery mobile:关闭弹出窗口后隐藏虚拟键盘

时间:2013-02-19 10:32:55

标签: javascript jquery ios html5 jquery-mobile

我在一个项目中使用jQuery mobile,需要一个带有textarea的弹出窗口:

<div data-role="popup" id="popupDialog" data-overlay-theme="none" data-theme="a" style="width: 350px; max-width:350px;" class="ui-corner-all" data-dismissible="false">
    <button id="dialogCloseButton" data-theme="a" data-icon="delete" data-iconpos="notext" class="ui-btn-left">Close</button>
    <div data-role="content" class="ui-corner-bottom ui-content" style="text-align: center; margin: auto;">
        <textarea id="textArea" data-theme="b" style="resize: none; max-width: 100%; max-height: 150px; width: 100%; height: 150px; padding-bottom: 5px;"></textarea>
        <button data-theme="a">Ok</button>
    </div>
</div>

我打开这样的弹出窗口:

$('#popupDialog').popup('open');

当我现在在textarea中输入文本并使用按钮关闭弹出窗口时,虚拟键盘将不会隐藏在运行iOS 6.1的iPad上。

我试过这个hack,这对我不起作用。

当我在关闭弹出窗口之前模糊textarea时,textarea将自动再次获得焦点(您可以使用“模糊”按钮在我的示例网站上测试它。)

修改:删除了指向示例的链接。

2 个答案:

答案 0 :(得分:1)

这对我有用:

$('#textArea').blur();
$('#popupDialog').attr("tabindex",-1).focus();

答案 1 :(得分:0)

它非常不言自明。第二行将解除所有输入字段的重点,它依赖于jQuery。我发现在单个聚焦文本字段上调用blur()并不总是有效。这些行中的任何一行都应该独立工作,但它们一起不能停止!

var hideKeyboard = function() {
    document.activeElement.blur();
    $("input").blur();
};