如何<a><button>在JS中點擊</button>或</a>發出聲音

Question

當在JavaScript中單擊帶有id“click_sound”的<a>元素或<button>元素時，如何在背景中隱藏聲音（“MySound.mp3”），是否可能？

請記住，如果單擊<a>或<button> ，我想在后台發出聲音！

編碼：

<html>
  <head></head>
  <body>
    <a id="click_sound">Click me</a>
  <button id="click_sound">Click me</button>
  </body>
</html>

聲音文件名：
MySound.mp3

Answer 1

做你所要求的最簡單的方法就是打使用javascript音頻上，當button或a （或任何真正的）標簽被點擊。 有幾種方法可以做到這一點：

您可以在onmouseup元素中運行javascript：

<html>
  <head></head>
  <body>
    <a id="click_sound" onmouseup="new Audio('path_to_audio_file.mp3').play()">Click me</a>
    <button id="click_sound" onmouseup="new Audio('path_to_audio_file.mp3').play()">Click me</button>
  </body>
</html>

或者更好的是，不是每次都運行音頻構造函數：

<html>
  <head></head>
  <body>
    <a id="click_sound" onmouseup="audio.play()">Click me</a>
    <button id="click_sound" onmouseup="audio.play()">Click me</button>

      <script>const audio = new Audio('path_to_audio_file.mp3')</script>
  </body>
</html>

如果你想使用一個外部腳本（因為你有其他的javascript，或者你只是喜歡它，我個人這樣做）只需將它放在window對象上：

<html>
  <head></head>
  <body>
    <a id="click_sound" onmouseup="window.audio.play()">Click me</a>
    <button id="click_sound" onmouseup="window.audio.play()">Click me</button>

      <script src='./path_to_file/somefile.js'></script>
  </body>
</html>

somefile.js：

  window.audio = new Audio('./path_to_audio/sound.mp3')

如果您需要有關上述任何內容的更多信息，請與我們聯系。

注意：您還可以使用：

document.getElementById('click_sound').addEventListener('mouseup', () =>  new Audio('path_to_audio_file.mp3').play())

實現同樣的目標。

欲了解更多信息，請參閱本和本或查找“JavaScript的‘音頻’構造”和“onmouseup事件”。

如何<a><button>在JS中點擊</button>或</a>發出聲音

問題描述

1 個解決方案

解決方案1
0 已采納 2019-06-09 23:51:34

如何<a><button>在JS中點擊</button>或</a>發出聲音

問題描述

1 個解決方案

解決方案1 0 已采納 2019-06-09 23:51:34

解決方案1
0 已采納 2019-06-09 23:51:34