【问题标题】:Is there any way to prevent virtual smartphone keyboard hiding input?有什么办法可以防止虚拟智能手机键盘隐藏输入?
【发布时间】:2016-02-01 22:38:27
【问题描述】:

在我的移动网站(我使用 jQuery Mobile)上,我在页面底部有输入。当我尝试向它输入一些信息时,会出现虚拟键盘(必须这样做)。问题是它隐藏了一半的页面,包括我正在输入的输入而不是向上滚动的页面。在示例中,输入 4-8 隐藏在键盘下方。

HTML

<input type="text" placeholder="1">
<input type="text" placeholder="2">
<input type="text" placeholder="3">
<input type="text" placeholder="4">
<input type="text" placeholder="5">
<input type="text" placeholder="6">
<input type="text" placeholder="7">
<input type="text" placeholder="8">

CSS

input {
  display: block;
  width: 100%;
  margin-bottom: 10px;
}

【问题讨论】:

  • 您希望它如何显示?

标签: html css jquery-mobile virtual-keyboard


【解决方案1】:

为此,我在输入焦点事件上使用了 jQuery.mobile.silentScroll(),然后在模糊时向下滚动。

类似这样的:

          $('#myinput').on('focus',function(){
                $.mobile.silentScroll($('#myinput').position().top - 100);
                $('#myinput').focus();
            });
            $('#myinput').on('blur',function(){
                $.mobile.silentScroll($('#myform').position().top);
            });

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-06-17
    • 2010-12-31
    • 1970-01-01
    • 2019-07-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多