javascriptでボタンをクリックしたときの音の追加

私はちょうどコーディングを始めました。私はクイズを出しました。生徒が正しい答えをクリックすると音が鳴り、誤った答えをクリックすると別の音が鳴ります。私はいくつかの投稿をオンラインで見つけましたが、彼らは働いていません。誰も助けることができますか？前もって感謝します！javascriptでボタンをクリックしたときの音の追加

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>

出典

2016-08-24 Shannon

HTML/JSファイルに 'audio'要素がありません。 – Rayon

明らかにあなたはJqueryを使用しています。だから、less codding and so onのために、このプロセスを処理するためにJqueryベースのコードを使用することをお勧めします。は、だからあなたの一番下にあるコードの下にコピーして、音を聞く必要があるときに今までそれを呼び出す：

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

そのとても簡単に！ do'ntはを忘れてと同じディレクトリ（フォルダ）に入れてください。このページはにあり、は 'audio.mp3'に置き換えられています。

多くの機能を追加するには、オーディオタグに希望通りにmore attributes（例：ループプリロードボリューム...）を追加できます。

これだけです！

出典

2016-08-24 07:39:37

まずはあなたの助けをありがとう。しかしmp3ファイルはクイズの最後にコードを追加しても、$（ '＃inputBox'）の間に追加してもまだ再生されません。css（ "color"、 "white"）; } else {。 DId私はそれを間違った場所に置くか、別のJqueryを自分のフォルダに追加する必要がありますか？ありがとう – Shannon

http://drax.ir/tmp/myquizPage.htmを見てください。私は音を再生するサンプルページを置く。あなたはそのソースコード内の記述を見ることができます。 –

また、AnswerChosen（真）を入れる必要があります。 after if（currentAnswer == myAnswer）{そしてもちろんAnswerChosen（false）;あなたが間違った答えを得たとき。サンプルページでソースコードとファイルをダウンロードできます。 :) –

あなたは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にあります。

出典

2016-08-24 06:36:49 GibboK

javascriptでボタンをクリックしたときの音の追加

答えて

関連する問題