2012-08-05 176 views
0

请看这里工作代码:http://jsfiddle.net/hrnDG/6/生成链接播放.MP3文件

我想修改此代码,因此所有可能的答案成为链接.mp3文件。当用户点击这些链接中的任何一个时,播放音频文件。用户然后可以选择他们的答案,然后按提交。

我该如何去做这件事?有什么简单的我可以适用于我的代码,以使其工作?我担心添加一些东西可能会禁用正确和错误的CSS类。

请知道:如果有人认为比链接变成可播放的MP3链接更有效率/更简单的方法,我都耳熟能详。

非常感谢!

我的代码:

<form> 
<table> 
<tr class="q1">      
    <td>What sounds like a rabbit?</td> 
    <td> 
     <input class="radiostyle wrong" type="radio" name="answers" value="Java" id="answers_1_Java" /> 
     <label for="answers_1_Java">A</label></td> 
    <td> 
     <input class="radiostyle right" type="radio" name="answers" value="JavaScript" id="answers_1_JavaScript" /> 
     <label for="answers_1_JavaScript">B</label></td> 
    <td> 
     <input class="radiostyle wrong" type="radio" name="answers" value="Ruby" id="answers_1_Ruby" /> 
     <label for="answers_1_Ruby">C</label></td> 
    <td> 
     <input class="radiostyle wrong" type="radio" name="answers" value="C#" id="answers_1_C#" /> 
     <label for="answers_1_C#">D</label></td> 
    <td><input class="submit submit-1" type="submit" value="Submit" /></td> 
    <td></td></tr></table></form>​ 

JS

$('.submit').click(function() { 
$(this).closest('tr') 
    .find('[name="answers"]') 
     .removeClass('checked') 
    .filter(':checked') 
     .addClass('checked'); 
return false; 
});​ 

回答

4

如果你可以假设你的用户有一个支持HTML5的浏览器,你可以隐藏<audio>元素添加到页面,从发挥你的脚本。

<audio hidden="hidden" id="sound"> 
    <source src="sound.ogg" type="audio/ogg" /> 
    <source src="sound.mp3" type="audio/mpeg" /> 
</audio> 

如果<audio>是他们的浏览器中支持,然后使用JavaScript通过下面的代码来启动播放器:

document.getElementById("sound").play();