在手機上將按空格鍵更改為屏幕上的按鈕

Question

我正在嘗試使用Aframe進行射擊游戲。

我希望以下代碼中的項目符號組件使用屏幕上的按鈕而不是空格鍵來創建。

   AFRAME.registerComponent('gun', {
  schema: {
    bulletTemplate: {default: '#bullet-template'},
    triggerKeyCode: {default: 32} // spacebar
  },


  init: function() {
    var that = this;
    document.body.onkeyup = function(e){
      if(e.keyCode == that.data.triggerKeyCode){
        that.shoot();
      }
    }
  },

  shoot: function() {
    this.createBullet();
  },

  createBullet: function() {
    var el = document.createElement('a-entity');
    el.setAttribute('networked', 'template:' + this.data.bulletTemplate);
    el.setAttribute('remove-in-seconds', 3);
    el.setAttribute('forward', 'speed:0.3');

    var tip = document.querySelector('#player');
    el.setAttribute('position', this.getInitialBulletPosition(tip));
    el.setAttribute('rotation', this.getInitialBulletRotation(tip));

    var scene = document.querySelector('a-scene');
    scene.appendChild(el);
  },

Answer 1

看起來像這樣：

  init: function() {
    var that = this;
    document.getElementById("shootbutton").onclick = function(e){
        that.shoot();
    }
  },

使用HTML：

    <button id="shootbutton" style="float: right;height: 50px;width: 100px;font-size : 19px;color:red;">SHOOT</button>