Javascript 使用JS变量（ubernewb）暂停/播放音频_Javascript_Html_Variables_Audio

Javascript 使用JS变量（ubernewb）暂停/播放音频

javascript html variables audio

Javascript 使用JS变量（ubernewb）暂停/播放音频,javascript,html,variables,audio,Javascript,Html,Variables,Audio,我正在做一个简单的项目，在侧边栏中包含一个媒体（mp3）播放器。我可以让播放/暂停按钮在视觉上切换，我可以通过将href分配给另一个图像来关闭音频。但是，当试图让交换的图像暂停音频时，我似乎无法理解，这是我的代码编辑：已删除快照代码编辑：想出了三种方法，下面的两位好心人发布了很棒的方法，但我也想出了如何通过jquery粗略地做到这一点 $('#left-05-pause_').click(function(){ $('#left-05-pause_').hide(); $('

我正在做一个简单的项目，在侧边栏中包含一个媒体（mp3）播放器。我可以让播放/暂停按钮在视觉上切换，我可以通过将href分配给另一个图像来关闭音频。但是，当试图让交换的图像暂停音频时，我似乎无法理解，这是我的代码

编辑：已删除快照代码

编辑：想出了三种方法，下面的两位好心人发布了很棒的方法，但我也想出了如何通过jquery粗略地做到这一点

$('#left-05-pause_').click(function(){
    $('#left-05-pause_').hide();
    $('#left-05-play_').show();
    }); 

$('#left-06-audio_').click(function(){
    audio.volume = 1;
    $('#left-06-audio_').hide();
    $('#left-06-mute_').show();
    });

你可以试试这个

<a href="#">
<img src="http://royaltrax.com/aadev/images/left/images/left_05.png" id="imgPauseChange" onclick="changeImage()">
</a>
<script language="javascript">
    function changeImage() {

        if (document.getElementById("imgPauseChange").src == "http://royaltrax.com/aadev/images/left/images/left_05.png")
        {
            document.getElementById("aud").play();
            document.getElementById("imgPauseChange").src = "http://royaltrax.com/aadev/images/left/images/left_05-pause.png";

         }
        else 
        {
            document.getElementById("aud").pause();
            document.getElementById("imgPauseChange").src = "http://royaltrax.com/aadev/images/left/images/left_05.png";
        }
    }
</script>


函数changeImage（）{
if（document.getElementById（“imgPauseChange”）.src==”http://royaltrax.com/aadev/images/left/images/left_05.png")
{
document.getElementById（“aud”）.play（）；
document.getElementById（“imgPauseChange”）.src=”http://royaltrax.com/aadev/images/left/images/left_05-pause.png";
}
其他的
{
document.getElementById（“aud”）.pause（）；
document.getElementById（“imgPauseChange”）.src=”http://royaltrax.com/aadev/images/left/images/left_05.png";
}
}
米奇，我有三点要告诉你：

无需将
环绕
var audio=document.getElementById（'audioId'））
，image=document.getElementById（'imageId'））
函数切换（）
{
如果（音频已暂停）
{
image.src='pause.png'
音频播放
}
其他的
{
image.src='play.png'
audio.pause（）
}
}

<body>
  <audio id="audioId">
    <source src="song.mp3" type="audio/mp3" />
  </audio>
  <img id="imageId" src="play.png" onclick="toggle()" />
  <script>
    var audio = document.getElementById( 'audioId' )
      , image = document.getElementById( 'imageId' )

    function toggle()
    {
      if ( audio.paused )
      {
        image.src = 'pause.png'
        audio.play()
      }
      else
      {
        image.src = 'play.png'
        audio.pause()
      }
    }
  </script>  
</body>