时间戳

首页 > 解决方案 > 如何允许用户通过单击按钮或按空格键来按下按钮

javascript - 如何允许用户通过单击按钮或按空格键来按下按钮

问题描述

我创建了一个设备，用户可以在其中单击打开和关闭按钮来打开和关闭它。我也希望用户能够通过按键盘上的空格键来做同样的事情，但我遇到了一些麻烦。另外我是 javascript 和这个网站的新手，所以请原谅我的任何错误。

let buttons1=document.querySelectorAll(".col-6");
		for(let i=0; i<buttons1.length; i++){
			buttons1[i].onclick=function(){
			document.body.onkeyup = function(e){
			if(buttons1[i].innerHTML=='ON / OFF'||e.keyCode==32){
      ...rest of my code....

标签： javascript

解决方案

你可以尝试这样的事情：

let buttonState = false;
document.getElementById("status").innerHTML = JSON.stringify(buttonState);

document.body.onkeyup = function(e) {  // if space bar pressed
  if (e.keyCode == 32 || e.key === ' ') {
    toggleState();
  }
}

function toggleState () { // toggle button state
  buttonState = !buttonState;
  document.getElementById("status").innerHTML = JSON.stringify(buttonState);
}
<button type="button" onclick="toggleState()">
Toggle On/Off
</button>
<div id="status"></div>

推荐阅读