html - 在此html5音频代码中添加一个简单的 “pause”函数？

Question

我已经尝试过简单的controls =“pause”代码，但是我不想显示可见的音乐播放器。我希望第二次单击“播放按钮”时出现暂停功能。

有没有办法在此代码中插入“点击暂停”功能？我不想看到一个单独的按钮。

谢谢!

$</div></td>
    $<td class="<div class="crowplayer">
   $ <a onclick="this.firstChild.play()" class="crowplayer"><audio $src="BirdSongsOGGshort/CrowCOedit.ogg"></audio>&#9658;</a>
$</div></td>

Answer 1

The controls attribute is a boolean attribute.

<...>

If the attribute is present, or if scripting is disabled for the media element, then the user agent should expose a user interface to the user. This user interface should include features to begin playback, pause playback <...>

source

因此， controls="pause"无效。
如果由于某些原因您不想指定 controls属性，则可以添加自己的播放/暂停 button:

var audio = document.querySelector('audio'),
    button = document.querySelector('button')
;
button.addEventListener(
  'click',
  function(e) {
    if (audio.paused) {
      button.textContent = 'Pause';
      audio.play();
    } else {
      button.textContent = 'Play';
      audio.pause();
    }
  },
  false
);