虚拟键盘挡住控件

在一些手机网站上填表单时,如果表单比较长,在点击控件打算输入文字时控件就被虚拟键盘挡住看不见了。用户还要去滚动页面才能看到控件,但虚拟键盘又会因此消失。当再次得到焦点时候可能又发生同样的情况。这是非常糟糕的用户体验,所以需要对其改进。
  虚拟键盘的弹出只非常暴力的,它直接遮在页面上出现,不会改变页面尺寸,也不会触发resize事件。而且这是系统级的东西,程序无法对其做进一步的控制,甚至无法获取到虚拟键盘的高度。
  但好在虚拟键盘通常从下方出现,所以对于页面上较长的表单,在控件得到焦点后应该将页面做适当的滚动,让目标控件处于顶部的位置,这样就能保证控件在虚拟键盘弹出后依然对用户可见了。大概就是这种感觉:
运行A:<input/><br/>
B:<input/><br/>
C:<input/><br/>
D:<input/><br/>
E:<input/><br/>
F:<input/><br/>
G:<input/><br/>
H:<input/><br/>
I:<input/><br/>
<script>
document.body.style.paddingBottom=document.body.offsetHeight+"px";
var s=document.getElementsByTagName("input");
for(var i=0;i<s.length;i++)
  s[i].onfocus=function(e){
    var t=this.offsetTop;
    document.body.scrollTop=t-4;
  };
</script>

虚拟键盘挡住控件

时间: 2024-10-17 00:58:05

虚拟键盘挡住控件的相关文章

【转】iOS 上常用的两个功能:点击屏幕和return退出隐藏键盘和解决虚拟键盘挡住UITextField的方法

iOS上面对键盘的处理很不人性化,所以这些功能都需要自己来实现, 首先是点击return和屏幕隐藏键盘 这个首先引用双子座的博客 http://my.oschina.net/plumsoft/blog/42545,他的文章写的很好,对大家的理解很有好处. 在 iOS 程序中当想要在文本框中输入数据,轻触文本框会打开键盘.对于 iPad 程序,其键盘有一个按钮可以用来关闭键盘,但是 iPhone 程序中的键盘却没有这样的按钮,不过我们可以采取一些方法关闭它.例如,我们可以实现按下 Rerun (有

Android UI设计之&lt;十一&gt;自定义ViewGroup,打造通用的关闭键盘小控件ImeObserverLayout

转载请注明出处:http://blog.csdn.net/llew2011/article/details/51598682 我们平时开发中总会遇见一些奇葩的需求,为了实现这些需求我们往往绞尽脑汁有时候还茶不思饭不香的,有点夸张了(*^__^*)--我印象最深的一个需求是在一段文字中对部分词语进行加粗显示.当时费了不少劲,不过还好,这个问题最终解决了,有兴趣的童靴可以看一下:Android UI设计之<六>使用HTML标签,实现在TextView中对部分文字进行加粗显示. 之前产品那边提了这样

微信开发安卓虚拟键盘挡住输入框的问题

是这样的,现在有一个这样的页面: 这个页面刚好一屏幕大小,所以没有滚动条,因为"保存"键上面那个项目备注是需要用户去填写的,当他点击后就会出现虚拟键盘,但安卓手机弹出键盘会遮住这个输入框,以至于用户看不见了.苹果手机天然不会喔,苹果手机的键盘弹出来是占了下面的位置,从而把页面推了上去,整个页面就缩小了就不会出现这样的情况.安卓手机情况如下图: 我不停尝试去解决这个问题,但最终都不成功. 思考一: 如果能模仿苹果一样,当键盘弹出来的时候,将整个页面缩小成页面底部刚好贴着键盘,那就完美了.

隐藏虚拟键盘,解决键盘挡住UITextField问题

再正式开始之前,先来介绍一下IOS的键盘类型: 一.键盘风格 UIKit框架支持8种风格键盘 ? 1 2 3 4 5 6 7 8 9 10 typedef enum {      UIKeyboardTypeDefault,                // 默认键盘:支持所有字符       UIKeyboardTypeASCIICapable,           // 支持ASCII的默认键盘       UIKeyboardTypeNumbersAndPunctuation,  //

popwindow 被魅族虚拟键挡住

之前在做项目的时候,做了一个分享的功能,调用的是友盟的第三方,功能实现的很完美,也完美分享了,但是在测试的时候,我用魅族X4的手机分享弹出的popwindow被手机自身的虚拟键挡住了,在网上找了好多资料,说可以把手机的虚拟键给关闭,却是也做到了,但是好像不太符合逻辑.看到qq的就不会被挡到心里很佩服qq的大神们是怎么做到的.经过我不断的在网上找popwindow的例子代码,终于发现在设置popwindow的高度的时候我设置成了wrap_content,在这里我觉得有必要讲一下wrap_conte

iOS 键盘挡住UITextField

iOS经常使用的两个功能:点击屏幕和return隐藏虚拟键盘和解决虚拟键盘挡住UITextField的方法 iOS上面对键盘的处理非常不人性化,所以这些功能都须要自己来实现, 首先是点击return和屏幕隐藏键盘 这个首先引用双子座的博客 http://my.oschina.net/plumsoft/blog/42545,他的文章写的非常好.对大家的理解非常有优点. 在 iOS 程序中当想要在文本框中输入数据,轻触文本框会打开键盘.对于 iPad 程序.其键盘有一个button能够用来关闭键盘,

Delphi XE7 FMX Android输入控件自适应虚拟键盘的位置

XE7带的Demo,演示了如何适应虚拟键盘,即当虚拟键盘弹出时,如果掩盖了当前的输入项,如Edit1,那么重新计算屏上所有控件的位置,让Edit1能够正常显示在键盘上面,让用户能看到输入的内容.问题是,键盘弹出后,如果用户利用键盘上的隐藏键,隐藏了键盘后,不能恢复屏上控件的位置,这个问题,其实XE5就存在.要感谢盒子上Flying Wang,用他的方法,很好的解决了上面的问题:原文在这里,改后的FMX.VirtualKeyboard.Android.pas代码在这里.

在 Android 的文字编辑控件 (TEdit) 中, 如何按下 Enter 就隐藏虚拟键盘

在 Windows 的应用中,我们常常为了让使用者能够快速输入,在Edit元件中的onKeyUp或者 onKeyDown 事件中主动侦测使用者输入的字元是否有换行符号 (Enter),当使用者按下了Enter,程式码就主动把游标 Focus 带到下个栏位,但在行动装置中,又多了一个课题:『如果是多个栏位,就带到下个栏位.但如果是单一栏位,或是最后一个栏位,就隐藏虚拟键盘』 这个课题笔者在 2014九月的笔记『Virtual Keyboard 的显示与隐藏』里面已经有介绍过一次,只是当时是聚焦在i

关于Edit控件focused状态,调用自己编写的键盘

一.涉及编写自己的自己的键盘 由于只使用英文字母跟数字等简单的字符而已,没有包括全角或者中文字符.所以直接使用跟手机的输入密码键盘一样的键盘即可. 遇到的问题:1.使用法keybd_event()的方式进行发送消息,不管发送大小写字母都是显示小写字母 2.键盘不能有焦点状态,否则使用的keybd_event则无法将字符发送给edit框.如果使用有焦点的状态则会导致edit控件跟我自己编写的键盘耦合性太大. 3.由于使用duilib的tilelayout而出现键盘的所有按键无法正常对齐. 解决方案