Question

当您在移动设备上选择输入文字时，是否有办法不将输入文字置于屏幕中间？当它这样做时，你必须保持向上滚动以在按Enter键后读取它上面的文本，这是不好的。

<head>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
</head>

//a div containing text from an ajax call after entering the input text
<input type = "text">

Answer 1

使用css将文本拉到所需的位置。

将文本包装在div中，然后将其放在您想要的位置。这样你的ajax就不会对它结束的地方产生任何影响。

<div id="ajaxCall" class="fixText">
  Ajax call
</div>

以下属性可帮助您移动文本：

#ajaxCall{
  text-align: left;
  position: relative / absolute;
  margin-top / bottom: 0;
}

Answer 2

您是在谈论iOS在激活本机键盘时移动页面内容的方式吗？如果是这样，您可以尝试使用JavaScript来缓解。考虑监听输入以获得焦点，然后调整页面或特定元素的滚动位置。类似的东西：

$(function() {
     $(input).focus(function() {
          $(document).scrollTop(500);
     });
});

（使用jQuery）

Answer 3

您可以通过jquery animate()函数尝试以下操作。在这里，滚动位置已经到400，因此您可能需要根据您的要求进行更改。

$(document).ready(function()
{         
$("#lower input:text").focus(function()
{
    $('html, body').animate({
        scrollTop: 400
    }, 2000);
});
});

以下是一个实例：http://jsfiddle.net/qggpjLqp/

在移动设备上选择输入文本时，不会将输入文本居中

3 个答案: