我刚刚开始编码。我做了一个测验,当学生点击正确的答案时,我想要播放声音,当他们点击不正确的答案时播放另一个声音。我在网上发现了一些帖子,但它们没有用。有人可以帮忙吗?提前谢谢!
使用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>
答案 0 :(得分:0)
您可以在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找到更多信息。
答案 1 :(得分:0)
显然您使用的是 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 ...)。
就是这样!