Question

当应用程序在触摸模式（平板电脑设备/模拟器）中运行并且我在输入时手动触发focus()时，未显示Windows虚拟键盘。而是在点击身体上的任何位置时显示键盘（意味着输入被聚焦）。 Hoverer在使用鼠标输入（而不是触摸）将应用程序作为常规桌面应用程序运行时 - 一切运行良好。

所以问题是如何避免这种行为，或者至少在输入聚焦时如何手动显示虚拟键盘？

我正在使用WinJS.4.0 4.0.0.winjs.2015.6.9。

复制问题的示例代码：

default.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>App1</title>

    <!-- WinJS references -->
    <link href="WinJS/css/ui-dark.css" rel="stylesheet" />
    <script src="WinJS/js/base.js"></script>
    <script src="WinJS/js/ui.js"></script>

    <!-- App1 references -->
    <link href="/css/default.css" rel="stylesheet" />

</head>
<body class="win-type-body">
    <div id="container">
        <div id="text-holder">
            Input value will be displayed here
        </div>
        <div id="input-holder">
            <form id="form">
                <input id="input" value="" type="number"></input>
            </form>
       </div>
    </div>

    <script src="/js/default.js"></script>
</body>
</html>

default.js

(function () {
    var input = document.getElementById('input');
    var form = document.getElementById('form');
    var textHolder = document.getElementById('text-holder');

    form.addEventListener('submit', function (e) {
        e && e.preventDefault();

        textHolder.innerText = input.value;
        input.value = "";
        input.blur();
    });

    textHolder.addEventListener('click', function (e) {
        console.log(e);
        input.focus();
    });
})();

default.css:

body {
    background-color: #fff;
}

#container {
  width: 100%;
  height: 100%;
}

#text-holder {
  width: 200px;
  height: 50px;
  background-color: #191A15;
  color: #fff;
}

视觉指导：

Step 1:

Step 1

Step 2:

Step 2

感谢您的关注，希望这个问题可以解决。

Answer 1

在W10（版本10.240）上运行winjs / uwp应用程序是一个已知的操作系统问题。已使用以下MSDN中提及的W10 TH2（版本10.586）进行修复thread

输入聚焦时，不显示Windows虚拟键盘

1 个答案: