Question

我刚刚开始编码。我做了一个测验，当学生点击正确的答案时，我想要播放声音，当他们点击不正确的答案时播放另一个声音。我在网上发现了一些帖子，但它们没有用。有人可以帮忙吗？提前谢谢！

使用Javascript：

function checkAnswer(){
    myAnswer=$('#inputBox').val();
    if(myAnswer.slice(myAnswer.length-1,myAnswer.length)==" "){
        myAnswer=myAnswer.slice(0,myAnswer.length-1);}
    if(currentAnswer==myAnswer){
        score++;
        $('#feedback').append('<img src="tick.png">');
        $('#inputBox').css("background-color","green");
        $('#inputBox').css("color","white");
    }
    else{
        $('#feedback').append('<img src="cross.png">');
        $('#inputBox').css("background-color","red");
        $('#inputBox').css("color","white");
        $('#inputBox').val($('#inputBox').val()+" (ans= "+currentAnswer+")");
    }
    $('#message').append('Press ENTER again to continue');
    $("#inputBox").prop('disabled', true);
    $("#gameArea").focus();
    gamePosition=2;
    if(currentQuestionNumber==numberOfQuestions){gamePosition=3;}
}//checkAnswer

HTML：

<!DOCTYPE HTML>
  <head>
    <title>Quiz</title>
    <meta name=viewport content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link href="main.css" rel="stylesheet" type="text/css"/>
    <link href="mainclock.css"rel="stylesheet"type="text/css"/>
    <script src="jquery.js"></script>
    <script src="controller.js"></script>
  </head>
  <body>
    <div id="gameArea" tabindex="1"></div>
    <div id="mainStage">
    </div>
  </body>

Answer 1

您可以在JavaScript中创建audio元素，并在必要时在应用程序中播放它。下面是如何在JS中动态发起audio元素的示例。

var audioElement = document.createElement('audio');
audioElement.setAttribute('src', 'some-audio-file-here.mp3');
// play audio
audioElement.play();
// stop audio
audioElement.stop()

可以在Using HTML5 audio and video找到更多信息。

Answer 2

显然您使用的是 Jquery 。所以我建议你使用基于Jquery的代码来处理这个过程，因为less codding and so on。所以只需复制你底部的代码，然后在需要听到声音时调用它：

  function rightAnswerChosen(){
    var audioFileName="audio.mp3";
    $("body").append("<audio src="+audioFileName+" autoplay=true loop=false/>");
  }

它如此简单！ 不要忘记将您的音频文件放在同一目录（文件夹）中，此页面位于 AND ，将其名称替换为'audio。 MP3' 。

要获得更多功能，您可以根据需要在音频标签中添加more attributes（例如：loop-preload-volume ...）。

就是这样！

在javascript中单击按钮时添加声音

2 个答案: