Question

目前我有按钮来控制流动站。例如，一个名为＆＃34; forward＆＃34;按下时加速，但释放时再次停止流动站。现在我想通过按键实现对流动站的控制。所以例如＆＃34; W＆＃34;应该加速keydown并停止keyup。到目前为止我找到的网站没有显示如何在JS中为keydown和keyup包含我已经存在的函数。我编码得不够好，无法自己解决这个问题。它们仅显示按下键时如何打印消息。有人可以帮助我吗？

编辑：代码和解决方案可以在下面的答案中找到

EDIT2：我的密钥编辑解决方案就在这里

message.delete()

Answer 1

您可以使用附加到onkeydown对象的函数onkeyup和document。

修改1

我编写了答案，将函数分解为与键侦听器分开，以便可以从按钮访问它们。

修改2

首先，我会让滑块的id不仅仅是class，因为这样可以让您更轻松地进行解析。

我建议不要像以前那样将值传递给函数，我建议每次运行函数时询问DOM值，因为我已经编辑了以下代码来执行：

function functforward{
        var myRPM = document.getElementById('slider').value;
        var myAng = document.getElementById('slider2').value;

        //funcforward code
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
              document.getElementById("demo").innerHTML = this.responseText;
            }
          };
          var request = "?drive=1" + "&rpm=" + myRPM + "&ang=" + myAng;
          console.log(request);
          xhttp.open("GET", request, true);
          xhttp.send();
}

function functStopDrive(){
        var myRPM = document.getElementById('slider').value;
        var myAng = document.getElementById('slider2').value;

        //funcstopdrive code
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
              document.getElementById("demo").innerHTML = this.responseText;
            }
          };
          var request = "?drive=0" + "&rpm=" + myRPM + "&ang=" + myAng;
          console.log(request);
          xhttp.open("GET", request, true);
          xhttp.send();
}

document.onkeydown = function (e) {
    if(e.key == 81){
         functForward();
    }
}

document.onkeyup = function (e) {
    if(e.key == 81){
        functStopDrive();
    }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div class="col-sm-4">
  <button id="Forward" type="button" class="btn btn-success btn-lg btn-block" ng-mousedown="functForward();" ng-mouseup="functStopDrive();">Forward</button>
</div>

<div id="slidecontainer">
  <input type="range" ng-model="myRPM" min="0" max="8000" id="slider" 
step="500">

  <input type="range" ng-model="myAng" min="-60" max="60" 
id="slider2" step="5">
</div>

Keydown和现有功能的keyup

1 个答案: