我添加按钮的延迟在 JavaScript 中不起作用

Question

对于课堂，我们必须制作自己的游戏，我想让它在开始某个场景后等待 5 秒来播放精灵。这行得通。但是在它播放一次之后，我想让那个精灵成为一个按钮。我通过添加 spritesheet 最后一帧的另一个文件并添加黄色轮廓（以便玩家可以看到它是可点击的）来尝试此操作。只需加载新的精灵并使其成为一个按钮即可。但我不想从一开始就添加按钮，仅在原始精灵播放一次后 5 秒后添加。我尝试使用 setTimeout 执行此操作，但现在它根本不加载精灵/按钮。精灵是一封从前门掉落的信件（信箱？）。所以在信掉在地上后，我不想让它可以点击，所以它会转到下一个场景。我是 JavaScript 的新手，我从未使用过 setTimeout 命令，所以我只想知道我是否正确使用它，如果没有，如何修复它。我尝试了网上找到的两种方法：

1:

function deurKnop(){
    var deurButton = this.add.sprite(111, 289, 'klik_deur', 1).setScale(1);
    
    deurButton.setInteractive({ cursor: 'pointer' });
    deurButton.on('pointerdown', () => { this.scene.start("gameScene2"); deurButton.setFrame(0); });
    deurButton.on('pointerover', () => { deurButton.setFrame(0); });
    deurButton.on('pointerout', () => { deurButton.setFrame(1); });
  };
setTimeout(deurKnop, 6000);

2:

setTimeout(function{
var deurButton = this.add.sprite(111, 289, 'klik_deur', 1).setScale(1);
    
    deurButton.setInteractive({ cursor: 'pointer' });
    deurButton.on('pointerdown', () => { this.scene.start("gameScene2"); deurButton.setFrame(0); });
    deurButton.on('pointerover', () => { deurButton.setFrame(0); });
    deurButton.on('pointerout', () => { deurButton.setFrame(1); });
  }; ,6000);

但都不起作用。如果有帮助，这是整个场景的代码：

//scene 1, woonkamer
gameScene1.preload = function() {
    this.load.spritesheet('brievenbus', 'assets/sprites/brievenbus.PNG', { frameWidth: 280, frameHeight: 359 });// Nu werkt het!!!
    this.load.spritesheet('openhaard', 'assets/sprites/openhaard.png', { frameWidth: 381, frameHeight: 672 });
  this.load.spritesheet('klik_deur', 'assets/sprites/klikdeur.png', { frameWidth: 146, frameHeight: 192 });
  
    this.load.image('woonkamer', 'assets/backgrounds/woonkamer.JPG');
  this.load.image('woonkamer_deur', 'assets/backgrounds/woonkamer_deur.JPG');
};
gameScene1.create = function() {
    this.add.image(400, 279.5, 'woonkamer_deur');
  
  deur = this.physics.add.sprite(108, 288, 'brievenbus').setScale(0.49);
  vuur = this.physics.add.sprite(650, 320, 'openhaard').setScale(0.15);

    this.anims.create({
    key: 'go',
        frames: this.anims.generateFrameNumbers('brievenbus', { frames: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14] }),
        frameRate: 23,
    delay: 5000,
        repeat: 0
    });
deur.anims.play('go', true);

  this.anims.create({
    key: 'Go',
        frames: this.anims.generateFrameNumbers('openhaard', { frames: [0, 1, 2, 3, 4, 5] }),
        frameRate: 12,
        repeat: -1
    });
vuur.anims.play('Go', true);

  function deurKnop(){
    var deurButton = this.add.sprite(111, 289, 'klik_deur', 1).setScale(1);
    
    deurButton.setInteractive({ cursor: 'pointer' });
    deurButton.on('pointerdown', () => { this.scene.start("gameScene2"); deurButton.setFrame(0); });
    deurButton.on('pointerover', () => { deurButton.setFrame(0); });
    deurButton.on('pointerout', () => { deurButton.setFrame(1); });
  };
setTimeout(deurKnop, 6000);
};

所以基本上“brievenbus”的动画是在这个场景开始 5 秒后发生的。我希望在 6 秒后显示并添加按钮。