我想用HTML5 / Javascript构建一个非常简单的终端模拟器。 我使用readonly textarea。
<TextArea readOnly id="screenID" rows="25" cols="80"
style="color: lime; background-color: black"
onkeypress="logKey(event.which||event.keyCode)">
</TextArea>
当按下某个键时,将调用logKey函数并存储keyCode。
<script>
var key = null; //one key buffer. could be extended to a longer buffer
function logKey(ch){key=ch};
var screen = document.getElementById("screenID");
function Tx(ch){screen.innerHTML += ch; screen.scrollTop = screen.scrollHeight};
function Rx() {k=key; key=null; if (k) {return String.fromCharCode(k)} else {return null}};
function demo(){k=Rx(); if (k) {Tx(k)} }; // copy keyboard to screen
Tx("\n");
setInterval(demo, 100)
</script>
Tx(ch)在屏幕上添加一个字符。 Rx()从键盘读取一个字符。
出于演示目的,从键盘读取一个字符并每隔100ms发送到屏幕。
这在PC上非常完美,但在移动设备上却不行,因为没有为只读文本区域显示虚拟键盘。
一种可能的解决方案可能是在同一位置组合一个可见的只读文本区域和一个不可见的文本区域(不是只读),但这破坏了PC版本的简单解决方案。 (我想为教育目的编写最简单的代码。)
是否有一种简单的方法可以强制显示虚拟键盘? (普通JS)