Question

我正在尝试向我的页面添加音频。事情是我有一个灯箱，一旦我点击灯箱，声音就会出现。

这是我的javascript：

audio = $("audio").get(0)

$('a').click(function(){
    if(audio.paused){
        audio.play();
    } else {
        audio.pause();
    }
});

这是我的HTML代码：

<a href="javascript:void(0)">
    <img src="img/speaker_icon.png" alt="play" />
</a>
<audio>
    <source src="sound/siol.ogg" type="audio/ogg">
    <source src="sound/siol.mp3" type="audio/mpeg">
</audio>

知道我应该改变什么？有什么快速解决方法吗？

Answer 1

使用jquery代码更新我以前的答案：

HTML：

<a href="javascript:void(0)">
    <img src="http://www.kafkabrigade.org.uk/wp-content/uploads/2011/07/button-pic.jpg" alt="play" />
</a>
<audio>
    <source src="http://www.hellopixel.net/click.mp3" type="audio/ogg">
    <source src="http://www.hellopixel.net/click.ogg" type="audio/mpeg">
</audio>

jQuery的：

audio = $("audio").get(0)

$('a').click(function(){
    if(audio.paused){
        audio.play();
    } else {
        audio.pause();
    }
});

这是工作的js小提琴代码：http://jsfiddle.net/SMR4V/1/

Answer 2

请检查以下工作代码以获得解决方案。

<html>
<head>

<script src="http://code.jquery.com/jquery-1.8.0.min.js" type="text/javascript">     </script>
<script type="text/javascript">
    function playerClicked() {
     audio=$("audio").get(0);
     audio.load()
       if(audio.paused){
        audio.play();
       } else {
        audio.pause();
       }

    }
</script>

</head>
<body>
<a id ="storyplayer" href="javascript:playerClicked();">
Click here to play.
</a>
<audio>
<source src="sound/siol.mp3" type="audio/mpeg">
</audio>

</body>
</html>

Answer 3

暂时对音频进行控制以检查元素是否出现在那里并且可以手动使用，使用浏览器的开发人员工具进行调试。乍一看，我会说它是失踪的;从第一行的末尾开始，应该是：

audio = $("audio").get(0);

将音频添加到我的页面

3 个答案: