Question

示例图片

我正在制作一款简单的游戏。至于我的游戏，当另一个div到达那个div的边界时，我使div不可见。并为该事件添加了一部分声音。但问题是，它不能正常工作。当第一个div到达第二个div时，声音效果正常，但是在第一个div到达第三个div之后，有一个问题 - 该事件的声音效果（第一个div到第三个div）给出无限循环声音效果的结果。这种无限循环的声音效果有我解释的第一个事件的声音。我该如何防止这个问题？

我的代码在这里，

我谈到的事件是碰撞事件; #character是我的角色，#taskapsa2是一堵墙。

        function collision6($taskapsa2, $character) {
          var x1 = $taskapsa2.offset().left;
          var y1 = $taskapsa2.offset().top;
          var h1 = $taskapsa2.outerHeight(true);
          var w1 = $taskapsa2.outerWidth(true);
          var b1 = y1 + h1;
          var r1 = x1 + w1;
          var x2 = $character.offset().left;
          var y2 = $character.offset().top;
          var h2 = $character.outerHeight(true);
          var w2 = $character.outerWidth(true);
          var b2 = y2 + h2;
          var r2 = x2 + w2;

          if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return;
     else {
    $("#character").hide();
 var audio22 = new Audio('lost.mp3');
audio22.play();}

        }


    window.setInterval(function() {
        $('#result').text(collision6($('#taskapsa2'), $('#character')));
    }, 200);

在这里，.con1是硬币。当角色达到硬币时，JS播放我的第一个声音。但是在那个事件之后（当角色碰到墙壁时），我的第一个声音无限循环（而我的第二个声音不能正常工作），但我不想那样。我想在那个事件之后播放我的第二个声音，只有第一个声音发出一次。

$("#mavikutu").hide();

    function collision7($icon1, $character) {
      var x1 = $icon1.offset().left;
      var y1 = $icon1.offset().top;
      var h1 = $icon1.outerHeight(true);
      var w1 = $icon1.outerWidth(true);
      var b1 = y1 + h1;
      var r1 = x1 + w1;
      var x2 = $character.offset().left;
      var y2 = $character.offset().top;
      var h2 = $character.outerHeight(true);
      var w2 = $character.outerWidth(true);
      var b2 = y2 + h2;
      var r2 = x2 + w2;

      if (b1 < y2 || y1 > b2 || r1 < x2 || x1 > r2) return;
 else {$(".icon").hide();
 $("#mavikutu").show();
 var audio11 = new Audio('coinsound.mp3');
audio11.play();

} // COIN SAKLADIM

    }


window.setInterval(function() {
    $('#result').text(collision7($('.icon'), $('#character')));
}, 200);

您可以将coinsound.mp3视为第一个声音，将lost.mp3视为第二个声音。第一个声音效果很好，但在那之后（当角色接触到墙壁时）它会无限地重复coinsound.mp3。我不想那样;我想只将lost.mp3作为第二个声音运行。

我需要改变什么？

Answer 1

你每隔200毫秒调用一次collision7函数，每次调用else的{{1}}子句 - 这样你就可以播放声音了。在显示/隐藏div中添加一些标志或类 - 这样您就可以检查您的标志是否尚未设置，播放一次然后设置标志。所以下次你不会播放声音。

第二个解决方案是在计算后检查div的旧状态（隐藏/显示）和新状态 - 仅在状态改变时播放声音。

示例：

if

在div不可见之后防止无限的声音循环？

1 个答案: