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

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