Javascript 如何使键盘读取按键并在下面的框中显示？

我一直在做这个代码，我必须创建一个功能正常的键盘。它必须有6位数字，021814是允许您输入并转到另一页的代码。如果您输入的数字超过6个，则应重置为零，如果您输入错误的键，则应闪烁红色并重置。我已经得到了我认为应该有效的东西，但它不允许任何数字被按下

在我的脚本的开头，在第7、9、11和14行中，

code.innerHTML

部分出现错误，表示“分配给原语的值将丢失”。我不知道该怎么办

这是我的剧本

 var doSomething = function(event) {
     var id= event.target.id;
     console.log(event.target.id);

     var code = document.getElementById("code").innerHTML;
//     code = code.trim();
     console.log("[" + code + "]");
     if (code.innerHTML == "Enter Pass Code") {
         document.getElementById("code").innerHTML = event.target.id;
         code.innerHTML = id.substr(-1,1);
     } else {
         code.innerHTML = code.innerHTML + id.substr(-1,1);
     }
     if (code.innerHTML.length > 6){
         code.innerHTML = 'Enter Pass Code';
     }
 };

var backspace = function (event) {
    let id=event.target.id;
    let shown = document.getElementById("code");
    if (shown.innerHTML.length < 2) {
        if (id === 'Back') {
            shown.innerHTML = 'Enter Pass Code';
        }
    } else if (shown.innerHTML.length >= 2) {
        console.log(shown.innerHTML.length);
        shown.innerHTML =shown.innerHTML.substr(0,shown.innerHTML.length-1);
    }
};

var displayReset = function (event) {
    let id = event.target.id;
    let shown = document.getElementById("code");
    shown.innerHTML = 'Enter Padd Code';
};
var input = function(event){
    let id = event.target.id;
    let shown = document.getElementById("code");
    if(shown.innerHTML === '021814') {
        shown.innerHTML = 'Access Granted';
        window.open("http://www.shadbase.com");
    }else {
        let displayString = 'Access Denied';
        shown.innerHTML = displayString.fontcolor('red');
        setTimeout(displayReset, 1000, event);
    }
};
document.getElementById("One").addEventListener('click',doSomething,false);
document.getElementById("Two").addEventListener('click', doSomething, false);
document.getElementById("Three").addEventListener('click', doSomething, false);
document.getElementById("Four").addEventListener('click', doSomething, false);
document.getElementById("Five").addEventListener('click', doSomething, false);
document.getElementById("Six").addEventListener('click', doSomething, false);
document.getElementById("Seven").addEventListener('click', doSomething, false);
document.getElementById("Eight").addEventListener('click', doSomething, false);
document.getElementById("Nine").addEventListener('click', doSomething, false);
document.getElementById("Zero").addEventListener('click', doSomething, false);
document.getElementById("Enter").addEventListener('click', input, false);
document.getElementById("Back").addEventListener('click', backspace, false);

var doSomething=函数（事件）{
var id=event.target.id；
日志（event.target.id）；
var code=document.getElementById（“code”）.innerHTML；
//code=code.trim（）；
console.log（“[”+代码+“]”）；
如果（code.innerHTML==“输入密码”）{
document.getElementById（“code”）.innerHTML=event.target.id；
code.innerHTML=id.substr（-1,1）；
}否则{
code.innerHTML=code.innerHTML+id.substr（-1,1）；
}
如果（code.innerHTML.length>6）{
code.innerHTML='输入密码'；
}
};
var backspace=函数（事件）{
设id=event.target.id；
让显示=document.getElementById（“代码”）；
if（show.innerHTML.length<2）{
如果（id==‘返回’）{
Showed.innerHTML='输入密码'；
}
}else if（show.innerHTML.length>=2）{
log（显示为.innerHTML.length）；
showed.innerHTML=showed.innerHTML.substr（0，showed.innerHTML.length-1）；
}
};
var displayReset=功能（事件）{
设id=event.target.id；
让显示=document.getElementById（“代码”）；
Showed.innerHTML='输入Padd代码'；
};
变量输入=函数（事件）{
设id=event.target.id；
让显示=document.getElementById（“代码”）；
如果（show.innerHTML=='021814'）{
should.innerHTML=‘已授予访问权’；
窗口打开（“http://www.shadbase.com");
}否则{
让displayString='访问被拒绝'；
Showed.innerHTML=displayString.fontcolor（'red'）；
设置超时（显示重置，1000，事件）；
}
};
document.getElementById（“一”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“两”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“三”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“四”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“五”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“六”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“七”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“八”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“九”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“零”）.addEventListener（'click'，doSomething，false）；
document.getElementById（“Enter”）.addEventListener（“单击”，输入，false）；
document.getElementById（“Back”）.addEventListener（'click'，backspace，false）；

下面是我的html的内容

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title> Keypad </title>
    <link rel = "stylesheet"
          type = "text/css"
          href = "css/keypad.css" />
    <link rel="s
    stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>
<div id="overall">
    <div id="accesspadtitle">
        Access Keypad
    </div>
    <div id = "numRowOne">
        <div id="One"> 1</div>
        <div id="Two"> 2</div>
        <div id="Three"> 3</div>
    </div>
    <div id = "numRowTwo">
        <div id="Four"> 4</div>
        <div id="Five"> 5</div>
        <div id="Six"> 6</div>
    </div>
    <div id = "numRowThree">
        <div id="Seven"> 7</div>
        <div id="Eight"> 8</div>
        <div id="Nine"> 9</div>
    </div>
    <div id = "numRowFour">
        <div id="Enter"> Enter </div>
        <div id="Zero"> 0 </div>
        <div id="Back"> Back </div>
    </div>
    <div id="code">Enter Pass Code</div>
</div>
<script src="javascript/keypad.js"> </script>
</body>
</html>

键盘
访问键盘
1.
2.
3.
4.
5.
6.
7.
8.
9
进入
0
返回
输入密码

只需更改以下行：

var code=document.getElementById（“code”）.innerHTML；

为此：

var code=document.getElementById（“代码”）；

---

.innerHTML

是一个属性，因此

code

将成为

#code

元素的内容请注意对元素内容的引用。

我认为webstorm警告告诉您要覆盖code.innerHTML之前一行中使用getElementById获得的值/引用，因为您有两种访问它的方法。也请谷歌这个错误。