Question

我有一个简单的iOS网络应用程序问题。

当您创建输入文本字段时，用户单击文本字段，移动safari将自动对焦输入字段，自动将用户单击的输入字段移动到屏幕中心。可视键盘将画布推到顶部或左侧或任何可以使输入字段居中的空间。

好吧，我要做的是禁用输入字段上的自动对焦，以便用户点击输入字段，画布不移动或动画，画布保持在屏幕上，如固定，以及可视键盘可能与输入字段重叠。（试图通过Javascript或CSS实现）

Answer 1

我之前遇到过这个问题，因为它试图将视图中的文本字段居中，因此固定大小的webapp（为iPad构建）会被浏览器部分滚动到视图之外。

在其中一个表单的父元素上设置“position:fixed”会阻止此操作。 'position:absolute'允许移动。根据您的布局，将表单设置为“position:fixed”可能会对您有所帮助。

position: fixed;

编辑：在修复大小的iOS webapp上处理表单的另一个相关事项：当文本字段处于活动状态时，如果用户拖动他们的手指，则可以在屏幕上移动整个固定元素（基本上滚动您不打算滚动的UI）。如果发现这种情况，可以向表单添加touchmove事件处理程序并阻止默认操作。

//jQuery:
$('#myForm').bind('touchmove', function(ev) { ev.preventDefault(); });
// Or not:
document.getElementById('myForm').addEventListener(
    "touchmove",
    function(ev) {
        ev.preventDefault();
    },
    false
);

Answer 2

最简单的方法是在页面顶部的任何div上设置“tabindex = 0”。

iOS网络应用程序：禁用输入文本字段上的自动对焦

2 个答案: