使用 JavaScript 在 phaser.io 中单击后禁用单击

Question

我有三个这样的按钮：

astroid: function() {

    astroid1 = this.add.button(15, 80, 'astroid1', this.astroid1Clicked, this);
    astroid2 = this.add.button(200, 10, 'astroid2', this.astroid2Clicked, this);
    astroid3 = this.add.button(400, 40, 'astroid3', this.astroid3Clicked, this);
    astroid4 = this.add.button(622, 90, 'astroid4', this.astroid4Clicked, this);
},

并为每个点击的按钮提供功能：

// Observing which asteroid is clicked and checking answer accordingly.
astroid1Clicked: function() {
    this.fire();

    //console.log(astroidContains[0]);
    // console.log(answear);
    //this.isCorrectAnswerHit(25, 100);
    if (astroidContains[0] == answear) {
        setTimeout(function() {
            //50 and 100 are the axis of astroid1
            Game.isCorrectAnswerHit(50, 100);
        }, 500);
    } else {
        this.isWrongAnswerHit();
    }
    allowClick = false;

    return false;
},

astroid2Clicked: function() {

    this.fire();

    //console.log(astroidContains[1]);
    //console.log(answear);
    if (astroidContains[1] == answear) {
        setTimeout(function() {
            Game.isCorrectAnswerHit(260, 10);
        }, 500);
    } else {
        this.isWrongAnswerHit();
    }

    allowClick = false;
    return false;
},

astroid3Clicked: function() {

    this.fire();

    //console.log(astroidContains[2]);
    //console.log(answear);
    if (astroidContains[2] == answear) {
        setTimeout(function() {
            Game.isCorrectAnswerHit(450, 40);
        }, 500);
    } else {
        this.isWrongAnswerHit();
    }
    allowClick = false;
    return false;
},

astroid4Clicked: function() {

    this.fire();
    //bullets.destroy();
    //console.log(astroidContains[3]);
    //console.log(answear);
    if (astroidContains[3] == answear) {
        setTimeout(function() {
            Game.isCorrectAnswerHit(620, 100);
        }, 500);
    } else {
        this.isWrongAnswerHit();
    }
    allowClick = false;
    return false;
},

我希望当用户单击一个按钮时所有按钮都将禁用，包括用户单击的按钮，所有功能将执行，然后用户可以单击任何按钮。请帮助我，我尝试了很多东西，但它们没有按我想要的那样工作，应该没有 jQuery.

Answer 1

为什么不使用已有的标志？

astroid4Clicked: function() {
  if (this.allowClick == true) {
  effect...
  this.allowClick = false;
  }
}

然后您只需决定何时以及在什么情况下将标志恢复为真。

最好检查 update() 函数中的标志，而不是在每个函数中分开。

是的，你有很多代码重复......

Answer 2

我的建议是使用回调而不是使用按钮 class。

// Assuming `this` is the Phaser.State -- this is for callback safety
let thisState = this
var myFireFunction = function(event) {
    thisState.fire() 
    // ...

    // Add a delay timer (or, this could be a callback when the bullet strikes the target)
    var delay = thisState.game.time.create(true)
    delay.duration = 500 //milliseconds

    // add the callback to the input again
    delay.onComplete.addOnce( function() {
        thisState.input.onDown.addOnce(myFireFunction)
    })
    delay.start()
}

// Add the callback ONCE to the `onDown` event
this.input.onDown.addOnce(myFireFunction)

这将防止用户快速点击屏幕并在多个线程上调用多个事件。一旦游戏处理完第一个事件，您就可以将回调添加到 onDown 信号。

查阅 Phaser's powerful Signal Class and the Timer Class 和相关教程，了解如何扩展这个想法。

使用 JavaScript 在 phaser.io 中单击后禁用单击

Disable click after one click in phaser.io using JavaScript

javascript

dom-events

phaser-framework