Javascript 使用单个按钮播放/暂停Html音频_Javascript_Html

Javascript 使用单个按钮播放/暂停Html音频

javascript html

Javascript 使用单个按钮播放/暂停Html音频,javascript,html,Javascript,Html,要在网页上播放/暂停音频文件，我目前使用两个不同的按钮，一个用于播放音频，另一个用于暂停音频以下是我正在使用的代码： <button onclick="playSong()">Play </button> <button onclick="pauseSong()">Pause </button> Javascript: <script> var song=document.getElementById("ad"); funct

要在网页上播放/暂停音频文件，我目前使用两个不同的按钮，一个用于播放音频，另一个用于暂停音频

以下是我正在使用的代码：

<button onclick="playSong()">Play
</button>

<button onclick="pauseSong()">Pause
</button>

Javascript:

<script>


var song=document.getElementById("ad");
function playSong()
{
song.play();
}

function pauseSong()
{
song.pause();
}
</script>

我想使用一个按钮来播放/暂停音频，例如：第一次单击音频将开始播放，第二次单击将暂停音频

是否可以将这两个按钮组合起来，以便我可以使用单个按钮处理音频

我自己在学校练习时使用了这个代码

var song=document.getElementById("ad");
function togglePlayPause()
{
    song.paused? song.play() : song.pause();
}

<!doctype HTML>
<html>
<head>
    <title>Java Script</title>
    <meta charset="utf-8">
    <script type="text/javascript">
        function Play()
        {
            var myVideo = document.getElementById("Video1");
            if(myVideo.paused)
            {
                myVideo.play();
                //document.getElementById("play").innerHTML="Pause";
            }
            else
            {
               myVideo.pause();
               //document.getElementById("Pause").innerHTML="Play";
            }
        }
    </script>
</head>
<body>
    <button type="button" onClick="Play()">Play/Pause</button>
    <video width="320" height="240" id="Video1">
        <source src="Simple%20Plan%20-%20Last%20One%20Standing%20(Lyric%20V%C3%ADdeo).mov" type="video/mov">
        <source src="Simple%20Plan%20-%20Last%20One%20Standing%20(Lyric%20V%C3%ADdeo).mp4" type="video/mp4">
    </video>
</body>
</html>

而不是

if (song.paused)

我自己在学校练习时使用了这个代码

<!doctype HTML>
<html>
<head>
    <title>Java Script</title>
    <meta charset="utf-8">
    <script type="text/javascript">
        function Play()
        {
            var myVideo = document.getElementById("Video1");
            if(myVideo.paused)
            {
                myVideo.play();
                //document.getElementById("play").innerHTML="Pause";
            }
            else
            {
               myVideo.pause();
               //document.getElementById("Pause").innerHTML="Play";
            }
        }
    </script>
</head>
<body>
    <button type="button" onClick="Play()">Play/Pause</button>
    <video width="320" height="240" id="Video1">
        <source src="Simple%20Plan%20-%20Last%20One%20Standing%20(Lyric%20V%C3%ADdeo).mov" type="video/mov">
        <source src="Simple%20Plan%20-%20Last%20One%20Standing%20(Lyric%20V%C3%ADdeo).mp4" type="video/mp4">
    </video>
</body>
</html>

而不是

if (song.paused)