ionic在开发ios系统微信时键盘挡住输入框的解决方法(键盘弹出问题)

2019-11-20 09:03:40

字体：大中小

来源：转载

供稿：网友

在使用ionic开发IOS系统微信的时候会有一个苦恼的问题，填写表单的时候键盘会挡住输入框，其实并不算什么大问题，只要用户输入一个字就可以立刻看见输入框了。

　　可惜的是，有些客户是不讲理的，他才不管这个问题，反正就是不行，所以在一天睡觉的时候突然惊醒，想出来这个方案。

　　我就不仔细讲代码了，直接上图　　

angular.module('MyApp').directive('focusInput', ['$ionicScrollDelegate', '$window', '$timeout', '$ionicPosition', function ($ionicScrollDelegate, $window, $timeout, $ionicPosition) {return {restrict: 'A',scope: false,link: function ($scope, iElm, iAttrs, controller) {if (ionic.Platform.isIOS()) {iElm.on('focus', function () {var top = $ionicScrollDelegate.getScrollPosition().top;var eleTop = ($ionicPosition.offset(iElm).top) / 2var realTop = eleTop + top;$timeout(function () {if (!$scope.$last) {$ionicScrollDelegate.scrollTo(0,realTop);} else {try {var aim = angular.element(document).find('.scroll')aim.css('transform', 'translate3d(0px,' + '-' + realTop + 'px, 0px) scale(1)');$timeout(function () {iElm[0].focus();console.log(2);}, 100)} catch (e) {}}}, 500)})}}}}])

上一篇：js 获取元素所有兄弟节点的实现方法

下一篇：使用JS轻松实现ionic调用键盘搜索功能(超实用)