Javascript 方法 pause() 仅适用于音频元素答案

【问题标题】：Javascript method pause() only works with audio elementJavascript 方法 pause() 仅适用于音频元素
【发布时间】：2012-05-11 03:07:04
【问题描述】：

所以我有这样的功能：

function music(song) {
var audio = new Audio("audio/" + song + ".ogg");
audio.play();
}

我遇到的问题是 audio.play() 工作得很好，但是如果我稍后尝试 audio.pause() （在定义相同的变量之后），它就不起作用了。但是，如果我这样做：

function music() {
var audio = document.getElementById("songname");
audio.play();
}

然后我可以定义变量，然后使用 audio.pause() 暂停音轨。问题是我想在 javascript 中执行此操作，因为我有很多曲目，我不想为每个曲目创建音频元素。

为什么第一段代码不允许我稍后暂停音频？有什么办法可以让它稍后暂停音频吗？如果没有，是否有任何替代方法涉及通过传递作为歌曲标题的参数从 javascript 播放音频？我不想在 html 中包含 src。

我怀疑 jQuery 可能对此有一个简单的解决方案，但从我研究的结果来看，我找不到任何东西。

【问题讨论】：

你是如何暂停曲目的，你能展示一下吗？
比如我有一个元素； <audio id="song" src="audio"> 我使用 Javascript 来播放它：function play() { document.getElementById("song").play(); } 并暂停：function pause() { document.getElementById("song").pause(); } 抱歉，格式不好，由于某种原因，我的换行符没有出现在评论中。
它应该像那样工作。

标签： javascript jquery html audio

【解决方案1】：

audio 只存在于函数内部。如果您需要在函数外部访问它，则返回您正在创建的 Audio 对象的实例：

function getAudio(song, play) {
var audio = new Audio("audio/" + song + ".ogg");
  if(play) {
    audio.play();
  }

  return audio;
}

var theTrack = getAudio('my_song', true);
theTrack.pause(); // pause the song
theTrack.play();  // play the song

第二个示例指的是我假设的音频元素，它反过来公开了Audio 对象的功能。第二个函数可以在任何地方工作的原因是因为 DOM 元素始终存在于 DOM 中，并且您引用它来获取底层音频 API，而不是直接使用音频对象/API。

【讨论】：

啊，我明白了。这就是上面带有 setTimeout 的示例有效的原因。感谢您的帮助，有什么方法可以在这里表示“感谢”或“荣誉”吗？
您可以通过单击问题上方的箭头来“投票”答案。如果某个答案有效地回答了您的问题，请单击复选标记将其选为答案。

【解决方案2】：

我刚刚测试了一个 sn-p，它可以正常工作

function music(song) {

    var audio = new Audio("audio/" + song + ".ogg");
    audio.play();
    setTimeout(function() { audio.pause(); }, 5000);

}

【讨论】：

【解决方案3】：

您可以在定义函数之前创建音频变量。

var audio = new Audio();
function playMusic(song) {
  audio.src = "audio/" + song + ".ogg";
  audio.play();
}
function pauseMusic() {
  audio.pause();
}

【讨论】：