首页 > 解决方案 > 如何检测何时显示数字键盘(在移动设备上)?

问题描述

我遇到了一个非常烦人的问题。

我有一个全屏的 html 画布。更改屏幕尺寸时,它会检测到屏幕尺寸已更改并自动将画布重新缩放为“新”全屏。

我将一个对象放入画布(基本上是一个文本输入字段)。

在移动设备上单击此对象时,虚拟键盘会弹出并明显改变屏幕大小。通过这样做,画布缩放到“新”屏幕尺寸。

我想在弹出数字键盘时忽略自动缩放功能。

有什么方法可以检测何时显示数字键盘?

标签: javascripthtmlcanvasmobile

解决方案


我能想到的唯一解决此问题的方法是在显示数字键盘时阻止页面调整大小:

$(function() {
    var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
    var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
    $("html, body").css({"width":w,"height":h});
});

推荐阅读