Javascript string.slice() 只工作一次

Lee*_*Lee 2 javascript slice

这已经让我发疯了几个小时,我确信我错过了一些简单的东西,或者也许没有。

我正在使用 Javascript 将我的个人主页变成类似控制台的应用程序。您可以在这里查看:www.fort-hub.com

我正在映射击键并使用退格键(键码 8)来更改innerHTML调用的控制台输入的属性,div#in减少一个结束字符,slice()如下所示:

HTML:

<!doctype html>

<html lang='en-gb'>

<head>

<meta charset="UTF-8">
<title>FortHUB</title>
<link href="ss.css" rel="stylesheet" type="text/css">   
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"> 

</head>

<body>

<div id="console">
    <div id="out"><h1>Welcome to fort-hub console</h1></div>

    <div id="in">
        <span id="text"></span><span id="cursor"><</span>
    </div>
</div>

<script src="fH.js"></script>

</body>

</html>
Run Code Online (Sandbox Code Playgroud)

JavaScript:

/* Globals */
var _NL_ = '>';
var consoleIn = document.getElementById('text');
var consoleOut = document.getElementById('out');

/* Func in question */
function keyPress(event)
{
    event.preventDefault();
    event.stopPropagation();

    var e = event || window.event;
    var key = e.which || e.keyCode;
    var keyChar;

    var allowedChars = new Array();
    allowedChars[0] = 8; /* backspace */
    allowedChars[1] = 13; /* return */
    allowedChars[2] = 32; /* space */

    /* Alphanumeric range only */
    if(key > 46 && key < 90 || inArray(allowedChars, key) === true)
    {
        keyChar = String.fromCharCode(key);
        var input = trim(consoleIn.innerHTML);
        /* Map backspace */
        if(key === 8)
        {
               consoleIn.innerHTML = input.slice(0, -1);
        }
        ...
        consoleIn.innerHTML += keyChar.toLowerCase();
    }
    ...
}
Run Code Online (Sandbox Code Playgroud)

因此,请通过转到 URL、输入内容并按退格键来测试这一点。将删除一个字符,但重复退格不会删除字符串的其余字符。

Ber*_*rgi 5

如果按下的键是退格键,则从 中删除最后一个字符input(并将innerHTML 设置为remain),但仍将 添加到keyCharinnerHTML。此附加内容\x08(根据字体和浏览器不显示,不被 Stackoverflow 接受为输入)。

return在 后面添加一条语句consoleIn.innerHTML = input.slice(0, -1);以中止按键处理程序。