页面的提交按钮采用的是固定定位在页面的底部,键盘弹出后,提交按钮紧挨着键盘的上方,
输入框获得焦点后,键盘弹出,并且输入框回自动定位上方的空白处,
此时由于键盘上方固定定位的提交按钮的原因有可能会遮挡住获得焦点的输入框,
从而导致用户看不见输入框,需要用户手动滑动屏幕,移动输入框的位置,才可以进行输入内容。 解决办法:
  1.监听window的大小的变化,来判断键盘的弹出和收回
  2.获取输入框底部的偏移位置,即输入框底部距离可见区域上面的距离A==输入框.offsetTop-屏幕卷起的高度
3.获得可见区间的高度B==window.height-提交按钮的高度
4.将AB进行比较,调整屏幕滚动的距离,从而将输入框定位到可见区域的位置,让用户可以输入
    ps:如果页面当中有很多个输入框,判断什么时候进行手动设置屏幕滚动的距离
window.height-提交按钮的高度>输入框底部距离可见区域上面的距离A>window.height+输入框的高度     

当输入框底部距离可见区域上面的距离A在这个范围内  都需要手动操作屏幕卷起的高度   差值==输入框底部距离可见区域上面的距离A-(window.height-提交按钮的高度)
$scope.$watch(function(){
return $window.innerHeight;
}, function(value) {
if(value< me.winH){
setTimeout(function(){
var scrollTop=parseInt($(".consultApplyScroll .scroll").css("transform").split(",")[1].slice(0,-2));
var offsetTop=$("#confirmedDate")[0].offsetTop;
var sub=((offsetTop+scrollTop)-(value-44));
var inputH=$('.textarea').eq(1).height();
sub=sub>0&&(offsetTop+scrollTop)>(value-44)&&(offsetTop+scrollTop)<(value+inputH)?sub:0;
var valuescrollTop=scrollTop-sub;
$(".consultApplyScroll .scroll")[0].style.webkitTransform="translate(0px,"+valuescrollTop+"px) scale(1) translateZ(0px)";
},500);
}else{
$sys.getScroll("consultApplyScroll").resize();
}
});

angular监听移动端键盘的弹起和收回的更多相关文章

  1. js监听用户的键盘敲击事件,兼容各大主流浏览器

    js监听用户的键盘敲击事件,兼容各大主流浏览器 <script type="text/javascript"> document.onkeydown = functio ...

  2. DSAPI多功能组件编程应用-HTTP监听服务端与客户端_指令版

    前面介绍了DSAPI多功能组件编程应用-HTTP监听服务端与客户端的内容,这里介绍一个适用于更高效更快速的基于HTTP监听的服务端.客户端. 在本篇,你将见到前所未有的超简化超傻瓜式的HTTP监听服务 ...

  3. DSAPI HTTP监听服务端与客户端

    本文中,演示了使用DSAPI.网络相关.HTTP监听,快速建立服务端和客户端. HTTP监听服务端的作用,是监听指定计算机端口,以实现与IIS相同的解析服务,提供客户端的网页请求,当然,这不仅仅是应用 ...

  4. DSAPI HTTP监听服务端与客户端_指令版

    前面介绍了DSAPI多功能组件编程应用-HTTP监听服务端与客户端的内容,这里介绍一个适用于更高效更快速的基于HTTP监听的服务端.客户端. 在本篇,你将见到前所未有的超简化超傻瓜式的HTTP监听服务 ...

  5. DSAPI多功能组件编程应用-HTTP监听服务端与客户端

    本文中,演示了使用DSAPI.网络相关.HTTP监听,快速建立服务端和客户端. HTTP监听服务端的作用,是监听指定计算机端口,以实现与IIS相同的解析服务,提供客户端的网页请求,当然,这不仅仅是应用 ...

  6. vue使用element-ui的el-input监听不了键盘事件解决

    vue使用element-ui的el-input监听不了键盘事件,原因应该是element-ui自身封装了一层div在input标签外面,把原来的事件隐藏了,所以如下代码运行是无响应的: <el ...

  7. 50-用Python监听鼠标和键盘事件

    转自:https://www.cnblogs.com/qiernonstop/p/3654021.html 用Python监听鼠标和键盘事件 PyHook是一个基于Python的“钩子”库,主要用于监 ...

  8. Angular 监听路由变化

    var app = angular.module('Mywind',['ui.router']) //Angular 监听路由变化 function run($ionicPlatform, $loca ...

  9. js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符

    js中对arry数组的各种操作小结   最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...

随机推荐

  1. pytest的一些你爱不释手的插件

    1. pytest-html 安装: pip install pytest-html # 通过pip安装pytest-html 运行测试文件的时候,命令行加上对应参数即可 比如:pytest test ...

  2. url 路径的拼接

    url  路径的拼接 刚开始做项目总是被路径所困扰,不知道何时该拼接,何时不拼接,怎么拼接,如何拼接,有像地址栏拼接一样的,又在跳转页面拼接的,还有在 a 标签中 href 中拼接的 ,当时做的时候一 ...

  3. Qt 学习之路 2(53):自定义拖放数据

    Qt 学习之路 2(53):自定义拖放数据 豆子  2013年5月26日  Qt 学习之路 2  13条评论上一章中,我们的例子使用系统提供的拖放对象QMimeData进行拖放数据的存储.比如使用QM ...

  4. 【第九届蓝桥杯大赛决赛真题】JAVA大学C组题解

    有空就会更新.... 有的题目重复了:再另一篇帖子:https://www.cnblogs.com/dgwblog/p/9090923.html 02 结果填空(满分29分) 标题:海盗与金币 12名 ...

  5. 【webservice】Two classes have the same XML type name(转)

    引言 需要调用另一个系统的提供的webservice接口,但是调用之后总是报错,用SoapUI测试接口却没有问题: 那就应该是代码的问题了,但是同样的代码也调用过其他系统却没有问题,不过最终还是解决了 ...

  6. Hibernate学习笔记(三)—— Hibernate的事务控制

    Hibernate是对JDBC的轻量级封装,其主要功能是操作数据库.在操作数据库过程中,经常会遇到事务处理的问题,接下来就来介绍Hibernate中的事务管理. 在学习Hibernate中的事务处理之 ...

  7. ui-grid使用详解

    HTML <pre name="code" class="html"><!--ui-grid css--> <link rel=& ...

  8. Convert DataTable to List<T> where Class of List is Dynamic

    using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Da ...

  9. Logistic Regression-Cost Fuction

    1. 二分类问题 样本:  ,训练样本包含  个: 其中  ,表示样本 包含 个特征:  ,目标值属于0.1分类: 训练数据:  输入神经网络时样本数据的形状: 目标数据的形状: 2. logisti ...

  10. 求一个区间里的一个x,这个x与这区间里面的所有数都互质

    链接:https://ac.nowcoder.com/acm/contest/301/H来源:牛客网 题描述 小乐乐上了一节数学课,数学老师讲的很好,小乐乐听的也如痴如醉. 小乐乐听了老师的讲解,知道 ...