如何在点击时暂停音乐？

Posted 2023-02-25

【中文标题】如何在点击时暂停音乐？

【英文标题】：How can I pause music on click?

【发布时间】：2020-05-17 00:34:35

【问题描述】：

我使用下面的代码（我在网上找到的）在我的网站上单击按钮时播放音频，现在我很好奇如何使音频暂停和/或停止播放什么时候用类似的代码点击同一个按钮？

const rollSound = new Audio("./mp3/SoItGoes.mp3");
$('#Triangle').click(e => rollSound.play());

【问题讨论】：

如果这对你有用？ ***.com/questions/2988050/…

rollSound.pause (w3schools.com/jsref/met_audio_play.asp) 是停止声音的方法。

【参考方案1】：

您可以在按钮上使用一个类来指定播放器的状态（class = "playing" 如果它正在播放，如果它暂停则什么都没有，启动到什么都没有），并在单击按钮时检查它：

html：

<button id="Triangle">Play/Pause</button>

javascript：

$('#Triangle').click(function(e) 
    if ($(this).hasClass('playing')) 
        rollSound.pause();
        $(this).removeClass('playing');
     else 
        rollSound.play();
        $(this).addClass('playing');
    
);

【参考方案2】：

您可以在事件处理程序中使用 if 语句来检查按钮文本值，您可以使用如下内容：

HTML：

<button id="Triangle">Play</button>

JS：

const rollSound = new Audio("./mp3/SoItGoes.mp3");
$('#Triangle').click((e) => 
  if($('#Triangle').text() === 'Play') 
      rollSound.play();
      $('#Triangle').text('Pause')
  
  else 
    rollSound.pause();
    $('#Triangle').text('Play')
  
);