javascript - jQuery 播放音频。音频重复每个正确或错误的答案

Question

每个正确和错误的答案都需要播放音频。

// Span "correct!" or "wrong!"
                if(isRightAnswer) {
                    $parent.find('div.wpvq-explaination div.wpvq-true').show();
                    $('#audio1').get(0).play();

                } else {
                    $parent.find('div.wpvq-explaination div.wpvq-false').show();
                    $('#audio2').get(0).play();

                }

我有两个音频文件，一个为 true，另一个为 false。无论真假，都需要始终播放音频。现在它仅处理前 1-2 个答案。

 <audio id="audio1" src="http://f5361a5c08a4c03f7c6f-acbeb9602bd0a56bf9c1a6bed3d8280b.r27.cf2.rackcdn.com/RightSound2%202.mp3" ></audio>

<audio id="audio2" src="http://f5361a5c08a4c03f7c6f-acbeb9602bd0a56bf9c1a6bed3d8280b.r27.cf2.rackcdn.com/wrongSound2.mp3" ></audio>

它有效，但它并没有重复每一个真假。仅一次工作。

SCREENSHOT

Answer 1

您遇到的问题是，一旦声音播放完毕，轨道的位置就不会返回到开头。因此，再次调用 play() 不会执行任何操作，因为音频位于轨道末尾。

要强制执行此操作，请在调用 play() 之前设置 currentTime = 0:

var correctAudio = $('#audio1').get(0);

$('#right-answer').click(function() {
  correctAudio.currentTime = 0;
  correctAudio.play();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<audio id="audio1" src="http://f5361a5c08a4c03f7c6f-acbeb9602bd0a56bf9c1a6bed3d8280b.r27.cf2.rackcdn.com/RightSound2%202.mp3"></audio>

<button id="right-answer">Right answer</button>