document.addEventListener('keydown', handle);
function handle(e) {
let value = document.getElementById("t11").value
if(e.code == "Space"){
if(value =="n")value="t"
else if(value == "t")value="P"
else if(value == "P")value="S"
else if(value =="S")value="n"
else value ="n"
document.getElementById("t11").value = value
}
}<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.3.2/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/15.3.2/react-dom.min.js"></script>
<html>
<body>
<label>Focus the input first (e.g. by clicking in it), then try pressing Space.</label>
<input type="text" id="t11" className="attendanceInput" readonly/>
</body>
</html>我有一个输入，通过按空格键，改变值。
<input type="text" id="11" onKeyDown={this.handleKeyDown.bind()} className="attendanceInput" readOnly/>
handleKeyDown(e) {
if(e.keyCode == 32){
let value = e.value
if(value =="n")e.value ="t"
else if(value == "t")e.value="P"
else if(value == "P")e.value="S"
else if(value =="S")e.value="n"
else e.value ="n"
document.getElementById("11").value=e.value
}
}
我需要用输入的id来更新值和其他动作。我如何才能做到这一点？谢谢，我有一个输入，通过按空格键来改变数值。
解决这个问题的一个方法是调用 e.currentTarget.id 之内 handleKeyDown 方法，它将返回 id 的值。
但是，如果你想更新输入元素的 input 元素，你将需要在你的组件中维护一个本地状态，并随后通过绑定状态更新的 onChange 事件。
<input value={input1} onChange={(e) => this.handleInput(e)} className="attendanceInput" />