移动端监听手机键盘弹起和关闭(Ionic+Cordova)
如果你的页面有动态计算滚动区域,比如像这样:
<ion-content has-bouncing="false"> <ion-scroll ng-if="downKeyboard" delegate-handle="detailTabList" has-bouncing="true" scrollbar-y="false" zooming="false" direction="y" ng-style="{"height":ionScrollHeight}"> <div> <ul> <li ng-repeat="item in data"> <label>{{data.title}}</label> <input type="text" > </li> </ul> </div> </ion-scroll> </ion-content>height : ionScrollHeight为页面初始化计算的滚动区域高度
在Controller.js里面写到:
$scope.ionScrollHeight = (window.innerHeight - 44) + "px"; 那么问题来了。外面的ion-scroll的高度在初始化的时候已经获得了ionScrollHeight 高度。但是你点击input掉起软键盘。会撑起ion-scroll的高度 但是在关闭软键盘后。ionScrollHeight的值就不存在了。所有需要监听键盘关闭重新把 ionScrollHeight赋值 1:首先需要你的项目打过
ionic-plugin-keyboard插件。如果没打可以执行
cordova plugin add ionic-plugin-keyboard --save
2:如何查询自己的项目有没有打过插件ionic plugin list //列出所有已安装插件 3:在你的控制器中写出监听function
$scope.ionScrollHeight = (window.innerHeight - 44) + "px"; $scope.downKeyboard = true; window.addEventListener("native.keyboardhide", function (e) { // todo 进行键盘不可用时操作 $scope.downKeyboard = false; $scope.ionScrollHeight = (window.innerHeight - 44) + "px"; $scope.$apply(); });
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。