Question

我在windows phone 8.1平台上的ionic / cordova app中遇到了一个非常奇怪的行为，我在那里实现了一个即时通讯工具。我把我的整个应用程序简化为一个简单的cordova（启动器）应用程序，以消除其他应用程序相关代码（如其他css类）的潜在副作用。但问题仍然存在......

问题

我的应用程序在页面底部包含一个html输入元素，用户可以在其中输入文本消息。只要此输入聚焦，就会出现键盘（输入窗格）。但是在第一次聚焦之后（通过点击第二个++时间），输入向上移动太远或被键盘推开。这些是屏幕截图：

第一次关注时一切都很好：

通过按“后退按钮”隐藏键盘并将输入引线重新对准：

似乎整个应用程序被屏幕上的键盘推开，因为标题栏也消失了。点击屏幕后，视图呈现正确（图1），但可用性仍然像一团糟。我只是想通了，输入元素下面的空间属于DOM的<body>。

到目前为止我做了什么

我开始创建一个普通的cordova应用程序来缩小所有潜在的副作用和错误来源（Source code on my Github）。这是我的程序：

使用cordova 5.1.1
cordova platform add wp8＆amp; cordova build wp8
使用Visual Studio 2013打开wp8项目文件并升级到windows phone silverlight 8.1应用程序（见下图），因为这是我们的应用程序的要求

并开始复制必要的html / css / js代码，以便在普通应用程序中重现该问题：

HTML

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <title>Hello World</title>
  </head>
  <body>
    <div class="bottom">
        <input type="search" placeholder="Search">
    </div>
  </body>
</html>

CSS

.bottom {
  position : absolute;
  right    : 0;
  left     : 0;
  bottom   : 0;
}

input {
  background-color: pink;
  width: 100%;
}

结果

首先，我认为问题消失了。但经过一番尝试后，我又遇到了同样的行为。它很少发生但仍然存在（只有一次~30次）。对我来说，这是证据，例如离子不负责这个问题（见下图）：

调查此行为并尝试在万维网上找到的所有潜在解决方案直至今天已花了数天时间。例如：

此外，我安装了WEINRE来调试Windows Phone 8.1设备（诺基亚Lumia 930）上的网络相关代码，但收效甚微。同样的问题也出现在模拟器中。我只能想象，升级到silverlight 8.1 app是必不可少的改变者。

Answer 1

您是否尝试过使用此$ ionicConfigProvider.scrolling.jsScrolling（false）？为了启用本机滚动。我有完全相同的问题。

.config(function($ionicConfigProvider) {
  $ionicConfigProvider.scrolling.jsScrolling(false);
 
  // Or for only a single platform, use
  // if( ionic.Platform.isAndroid() ) {
    // $ionicConfigProvider.scrolling.jsScrolling(false);
  // }
}

WP8.1输入窗格（键盘）推送/移动cordovaView / Html内容

1 个答案: