关闭

处理input输入框被输入法遮住

标签: javascript
2754人阅读 评论(0) 收藏 举报
分类:
//处理input输入框被输入法遮住
function inputIos(inputBox){
    var inputF = $(inputBox).find('input');//找到对应的input
    if(inputF == document.activeElement){
        //获取焦点时用喔
        setTimeout(function(){
            var inputIsNotInView = notInView(),
                Width = window.innerWidth,
                Height = window.innerHeight;
            if(inputIsNotInView){
                if(Width != 750){
                    var bottomAdjust = (Height - window.innerHeight - 88) + 'px';
                    $(inputBox).css('bottom',bottomAdjust);
                }else {
                    var bottomAdjust = (Height - window.innerHeight - 88 - 432) + 'px';
                    $(inputBox).css('bottom',bottomAdjust);
                }
            }
        },600);

    }else {
        //失去焦点时用喔
        var inputIsNotInView=notInView();
        if(inputIsNotInView){
            $(inputBox).css({'opacity':0,bottom:0});
            setTimeout(function(){
                $(inputBox).css('opacity',1);
            },600)
        }
    }


    //------------------------------
    function notInView(){
        var bottom = inputBox.getBoundingClientRect().bottom;
        if (window.innerHeight - bottom < 0){
            return true;
        }else {
            return false;
        }
    };
}
0
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

手机网页中输入框被输入法遮挡问题

之前要做一个弹出对话框,填写信息,发现在手机上看的时候,较后的输入框在填写信息时,输入框被输入法遮挡,只能盲填。 前提 1.弹出的对话框用display:fixed定位的 2.对话框大小固定 解决办法 css部分 (dlg-top与dlg-bottom为对话框的类,用于确定对话框...
  • u010451286
  • u010451286
  • 2015-08-13 18:05
  • 6449

js解决软键盘遮挡输入框问题

请在这里查看示例 ☞ cover示例经验须知 弹出软键盘时: ios端$(‘body’).scrollTop()会改变 android端$(window).height()会改变 拉起键盘不是一瞬间,而是有一个缓动过程 问题重现 ios端,经常会出现输入法遮挡输入框的问题(特别是那种有一个白色顶部...
  • u011500781
  • u011500781
  • 2016-12-29 12:48
  • 5784

手机端网页:安卓手机输入法遮挡输入框问题

// 处理安卓手机输入法遮挡输入框问题(摘自WEUI) if ((/Android/gi).test(navigator.userAgent)) { window.addEventListener('resize', function () { ...
  • SilentBlue
  • SilentBlue
  • 2016-08-04 16:23
  • 1606

关于EditText文本框,在输入的时候输入法挡住了内容

在AndroidManifest.xml中的anctivity中添加属性  android:windowSoftInputMode="adjustPan" 设置为当前窗口的内容将自动移动以便当前焦点从不被键盘覆盖和用户能总是看到输入内容的部分
  • vqqYuAn
  • vqqYuAn
  • 2015-07-09 16:52
  • 976

android全屏/沉浸式状态栏下,各种键盘挡住输入框解决办法

*本篇文章已授权微信公众号 guolin_blog (郭霖)独家发布 在开发中,经常会遇到键盘挡住输入框的情况,比如登录界面或注册界面,弹出的软键盘把登录或注册按钮挡住了,用户必须把软键盘收起,才能点击相应按钮,这样的用户体验非常不好。像微信则直接把登录按钮做在输入框的上面,但有很多情况下,这经常满...
  • smileiam
  • smileiam
  • 2017-04-04 11:03
  • 17345

IOS中输入框被软键盘遮挡的解决办法

做IOS开发时,难免会遇到输入框被键盘遮掩的问题。上网上搜索了很多相关的解决方案,看了很多,但是由衷的觉得太麻烦了。     有的解决方案是将视图上的所有的东西都添加到一个滚动视图对象( UIScrollView )中,然后滚动视图实现输入框不被软键盘覆盖,...
  • enuola
  • enuola
  • 2012-08-28 18:30
  • 47079

解决移动端Web安卓机点击输入框,输入法遮挡输入框的问题

解决移动端Web安卓机点击输入框,输入法遮挡输入框的问题
  • lizheng_0508
  • lizheng_0508
  • 2017-05-08 15:26
  • 1603

Android软键盘使用及输入法挡住输入框的问题解决

在Android的开发中,有时候会遇到软键盘弹出时挡住输入框的情况。这时候可以设置下软键盘的模式就可以了。 有两个版本解决: 1.直接用代码修改输入模式: getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPU...
  • joephone77
  • joephone77
  • 2013-11-12 14:24
  • 551

教你解决android软键盘挡住输入框问题!

<br />大家在布局时候,有时候会发现输入框被挡住一部分,能完全显示出来,但是系统自带短信界面<br />可以完全漂浮在软键盘之上,看了一下短信源码,修改一下输入模式就可以了,源码如下<br />代码方式: <br />getWindow().set...
  • leilu2008
  • leilu2008
  • 2011-05-27 16:14
  • 25256

根据输入框的弹出改变界面样式,解决键盘挡住输入框的问题

  • 2014-04-30 13:58
  • 1.38MB
  • 下载
    个人资料
    • 访问:162443次
    • 积分:2997
    • 等级:
    • 排名:第13629名
    • 原创:121篇
    • 转载:170篇
    • 译文:0篇
    • 评论:21条
    最新评论