我的html文件中有这个:

<html>
    <head>
        <title>
            CMD.exe
        </title>

        <link rel="stylesheet" type="text/css" href="cmd.css" />
        <script language="JavaScript" SRC="cmd.js"></script>
    </head>
    <body onload="blinkCursor();">
        <span id="content">&gt;</span><span style="display:none;" id="blink"  >|</span>
        <div onKeyPress="keyPress(event);" style="position:absolute;z-index:2;width:100%;height:100%;"></div>
    </body>
</html>

这是我的Javascript:
var blinkOn =false;

function blinkCursor() {
    if (blinkOn)
        {
            document.getElementById("blink").style.display="none";
        } else {
            document.getElementById("blink").style.display="inline";
        }
    blinkOn=!blinkOn;
    setTimeout("blinkCursor()",500);
}

function keyPress(e) {
    var keynum = ('which' in event) ? event.which : event.keyCode;
    var val=String.fromCharCode(keynum);
    document.getElementById("content").innerHTML=document.getElementById("content").innerHTML+val
}

如果与此CSS样式结合在一起:
html, body {
        background-color:black;
        overflow:hidden;
        font-family:"lucida console";
        color:white;
    }

创建一个酷酷的命令式网页。唯一的问题是文本输入在Google Chrome中不起作用,但在IE(也许还有ff?)。我也不知道如何检测按键,如[回车]和[退格]。
任何帮助都将不胜感激!

最佳答案

我运行了一个jsFiddle,第一次闪烁之后Chrome似乎没有正确注册这些函数。另外,当您在函数中定义为e时,您正在使用keyPress函数中的event

var blinkOn =false;

blinkCursor = function() {
    if (blinkOn)
        {
            document.getElementById("blink").style.display="none";
        } else {
            document.getElementById("blink").style.display="inline";
        }
    blinkOn=!blinkOn;
    setTimeout("blinkCursor()",500);
}

keyPress = function (e)
{
    var keynum = ('which' in e) ? e.which : e.keyCode;
    var val=String.fromCharCode(keynum);
    document.getElementById("content").innerHTML=document.getElementById("content").innerHTML+val
}

如果你只是在页面上有一个“控制台”,你也可以将按键(事件)从div切换到body标签。
要检测回车和退格等,请检查它们的键码,如下所示:
keyPress = function (e)
{
    //keynum setting
    if (keynum == 13) { // it's a return key press }
    //other stuff
}

将13替换为要匹配的任何项的键代码。
小提琴在这里:http://jsfiddle.net/XuNv2/

10-07 19:05
查看更多