我有一个音频文件，可以在单击锚标记时播放。如果再次单击锚标记，我希望音频暂停，我只是对 javascript 了解得不够多，无法将后半部分拉下来。我不想更改他们单击的锚标记的内容，我只想在他们单击标记时启动和暂停音频文件。
到目前为止，这是我所拥有的，至少可以使声音文件可播放：
<audio id="audio" src="/Demo.mp3"></audio>
<a onClick="document.getElementById('audio').play()">Click here to hear.</a>
一种 Vanilla Javascript 方式来做你需要的。
注意：我注意到对其他问题的评论对原生 js 方法有多个赞成票，并且看到 OP 没有jquery标签。
所以WORKING EXAMPLE：
SOLN 1:(我最初使用事件的解决方案）
var myAudio = document.getElementById("myAudio");
var isPlaying = false;
function togglePlay() {
isPlaying ? myAudio.pause() : myAudio.play();
};
myAudio.onplaying = function() {
isPlaying = true;
};
myAudio.onpause = function() {
isPlaying = false;
};<audio id="myAudio" src="http://www.sousound.com/music/healing/healing_01.mp3" preload="auto">
</audio>
<a onClick="togglePlay()">Click here to hear.</a>SOLN 2:(myAudio.paused根据dandavi 的评论使用属性）
var myAudio = document.getElementById("myAudio");
function togglePlay() {
return myAudio.paused ? myAudio.play() : myAudio.pause();
};<audio id="myAudio" src="http://www.sousound.com/music/healing/healing_01.mp3" preload="auto">
</audio>
<a onClick="togglePlay()">Click here to hear.</a>var audioElement= document.getElementById("audio-player");
function togglePlay() {
if (audioElement.paused) {
audioElement.play();
}
else {
audioElement.pause();
}
};
您可以使用 jQuery 对此进行切换。
<a id="music-button" style="cursor:pointer;">
<img src="http://i.stack.imgur.com/LT3WE.png"></a>
<audio id="playMusic" autoplay>
<source src="sound.mp3">
</audio>
<script type="text/javascript">
$('#music-button').toggle(
function () {
document.getElementById('playMusic').play();
},
function () {
document.getElementById('playMusic').pause();
}
);
</script>
myAudio 变量必须在函数调用中......它工作正常
function togglePlay() {
var myAudio = document.getElementById("myAudio");
return myAudio.paused ? myAudio.play() : myAudio.pause();
};<audio
id="myAudio" src="https://clubajax.pythonanywhere.com/media/contact/backgroundM.mp3" preload="auto">
</audio>
<input type="button" value="sound" onclick="togglePlay()" />var Sample-Audio = document.getElementById("Sample");
function togglePlay() {
return Sample-Audio.paused ? Sample-Audio.play() : Sample-Audio.pause();
};
<audio id="Sample" preload="auto">
<source src="./sounds/rain.mp4" type="audio/mp4">
<source src="./sounds/rain.ogg" type="video/ogg">
</audio>
<a onClick="togglePlay()">Click here to hear.</a>