为什么在 javascript 中无法播放音频
[英]Why does audio not play in javascript
问题描述
I want to add background music to my website.
我想在我的网站上添加背景音乐。 I've tried this JS code:我试过这个JS代码：
var sound;
function initialAudio() {
'use strict';
sound = new Audio();
sound.src = '../audio/test.mp3';
sound.loop = true;
sound.play();
}
window.addEventListener("load", initialAudio);
I have linked the JS and HTML, but when I open the site, the sound doesn't play.我已经链接了JS和HTML，但是当我打开网站时，声音没有播放。 Can you please help me?你能帮我么？
5 个解决方案
解决方案1
1 已采纳 2018-12-31 14:13:06
You need to use an audio element in your html, this is how to do it.您需要在 html 中使用音频元素，这是如何做到的。
<!DOCTYPE html>
<html>
<body>
<audio id="audioContainer">
<source src="myMp3.mp3" type="audio/mpeg">
</audio>
<p>Click the buttons to play or pause the audio.</p>
<button onclick="playMp3()" type="button">Play Mp3</button>
<button onclick="pauseMp3()" type="button">Pause Mp3</button>
<script>
const audioContainer = document.getElementById("audioContainer");
function playMp3() {
audioContainer.play();
}
function pauseMp3() {
audioContainer.pause();
}
</script>
</body>
</html>
解决方案2
1 2019-01-01 11:59:08
There's this javascript audio library called HOWLER.JS and its really easy to use.有一个名为HOWLER.JS 的javascript 音频库，它非常易于使用。 Include this script file:包含此脚本文件：
<script src = "https://cdnjs.cloudflare.com/ajax/libs/howler/2.1.1/howler.js"></script>
Add this code snippet to your html:
将此代码片段添加到您的 html：var sound = new Howl({ src: ['../audio/test.mp3'], autoplay: true, loop: true, volume: 0.5, }); sound.play();
For more info visit: HOWLER.JS DOCS更多信息请访问： HOWLER.JS DOCS
解决方案3
0 2018-12-31 17:07:18
Just use the HTML5 audio element with the auto play attribute.只需使用带有自动播放属性的 HTML5 音频元素即可。 As mentioned in the comments, browser support for autoplay is tenuous (for good reason) but it works for me in Firefox.正如评论中提到的，浏览器对autoplay支持很薄弱（有充分的理由），但它在 Firefox 中对我有用。
<audio autoplay loop> <source src="http://soundbible.com/grab.php?id=464&type=wav"></source> </audio>
If you want the user to be able to pause the audio, just add a controls attribute:如果您希望用户能够暂停音频，只需添加一个controls属性：
<audio autoplay controls loop> <source src="http://soundbible.com/grab.php?id=464&type=wav"></source> </audio>
You can also use JS to have a button somewhere else on the page play/pause as used in another answer.您还可以使用 JS 在另一个答案中使用的页面播放/暂停的其他位置设置一个按钮。
解决方案4
0 2021-05-07 06:45:08
If you have done it in this way:如果你已经这样做了：
var sound = new Audio('sounds/tom-3.mp3');
sound.play();
This does not work in my case, so I did this:这在我的情况下不起作用，所以我这样做了：
var sound = new Audio('sounds\\\tom-3.mp3');
sound.play();
解决方案5
0 2021-12-02 14:38:54
A modern browser will refuse to play any sound without user interaction.现代浏览器将拒绝在没有用户交互的情况下播放任何声音。 Your code should work fine, if started from a user event, like onclick.如果从用户事件（如 onclick）开始，您的代码应该可以正常工作。
解决方案6
0 2022-09-17 20:07:18
All of your audio files listed in the JavaScript code MUST be named as HTTPS, not HTTP. JavaScript 代码中列出的所有音频文件必须命名为 HTTPS，而不是 HTTP。 And obviously, that means the website(s) you are linking to (including yours) must be secure.显然，这意味着您链接到（包括您的）的网站必须是安全的。 That is, you need to have your security certificate, and make sure it is activated.也就是说，您需要拥有安全证书，并确保它已被激活。 It's a security issue with Chrome.这是 Chrome 的安全问题。 I hope that helps.我希望这会有所帮助。 = -) = -)
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.