HTML5自动播放一次(HTML5 autoplay once)

以下javascript函数提供并自动播放音频文件(通过HTML 5音频标签)，在6秒时切换mp3播放并从头开始循环+自动播放音频。

JavaScript的：

function updateaudio() {

var a_str = '';

document.getElementById('audio_span').innerHTML = a_str;

}

setInterval(updateaudio, 6000)

HTML：

有没有使用html5音频属性将自动播放播放设置为一次性即非循环？ 或者，是否有另一种方法来实现这一点(通过javascript或html5)？ 音频事件结束后，我想设置一个标志并停止任何播放。

The following javascript function serves and autoplays a audio file (via a HTML 5 audio tag), cuts the mp3 playback at 6 seconds and loops + autoplays the audio from the beginning.

javascript:

function updateaudio() {

var a_str = '';

document.getElementById('audio_span').innerHTML = a_str;

}

setInterval(updateaudio, 6000)

html:

Is there any using the html5 audio attribute to set autoplay playback to once off i.e. non-looping? Alternatively, is there another way to achieve this (via either javascript or html5)? Upon the audio event ending, I would like to set a flag and stop any playback.

原文：https://stackoverflow.com/questions/21272209

更新时间：2020-08-24 14:08

最满意答案

如果您不想要循环，请不要使用setInterval()。

如果您只是想在六秒后暂停播放，请执行以下操作：

setTimeout( function () {

document.getElementById('audio_span').pause();

}, 6000)):

Don't use setInterval() if you don't want a loop.

If you simply want to pause the playback after six seconds do:

setTimeout( function () {

document.getElementById('audio_span').pause();

}, 6000)):

相关问答

您可以使用autoplay实现此目的：

Your browser does not support the video tag.

如果你想获得autoplay的参数，让我们说，用php，你可以使用： url： http://mydomain/vi

...

如果您不想要循环，请不要使用setInterval()。 如果您只是想在六秒后暂停播放，请执行以下操作： setTimeout( function () {

document.getElementById('audio_span').pause();

}, 6000)):

Don't use setInterval() if you don't want a loop. If you simply want to pause the playback after six second

...

iOS 10更新 自动播放禁止已经取消了iOS 10 - 但有一些限制(例如，如果没有音轨可以自动播放A)。 要查看这些限制的完整列表，请参阅官方文档： https ： //webkit.org/blog/6784/new-video-policies-for-ios/ iOS 9以前 从iOS 6.1开始， 无法在iPad上自动播放视频。 我假设为什么他们禁用了自动播放功能？ 那么，尽管许多设备所有者对其设备有数据使用/带宽限制，我认为苹果认为用户自己应该决定何时启动带宽使用。 经过一番研究，我

...

你可以使用html5的媒体方法和事件 。 一旦幻灯片放映动画完成，我就使用play方法来开始play视频，并在视频播放结束后使用ended回调函数调用fancybox.next()函数。 这是您可以检查的工作版本： $(document).ready(function() {

$(".fancybox").fancybox({

afterShow: function() {

// After the show-slide-animation has ended - p

...

只是播放甚至缓冲歌曲并不是特别公平，因为人们可以出于其他原因(例如检查更新)分享链接时，网站上有一点机会。 人们可以在移动网络的页面上，带宽有限，这些大小的下载不应该开始偷偷摸摸。 编辑：一些额外的参考 以下是关于不在自动播放中播放音乐的原因的概述 相反，我个人非常喜欢的网站，在自动播放中大量使用背景音乐 但是，如果您已经构建了自己的播放器并希望将其作为页面的一项功能，那么将该播放器设置为自动播放不仅会使您自己的工作贬值，还会完全破坏您的设计。 相反，您可以相信想要听到音乐的人会识别您的音频播放器

...

为视频指定一个id(myVideo)并在afterShow函数中添加此行 var vid = document.getElementById("myVideo");

vid.play();

使用Javascript $(document).ready(function() {

$("[data-fancybox]").fancybox({

afterShow: function() {

// After the show-slide-animation

...

您可以实现类似于Modernizr所做的例程...它动态创建一个带有内联base64 src的视频元素，然后在其上测试自动播放以确定是否支持该功能。 你可以在这里看到来源： https://github.com/Modernizr/Modernizr/blob/master/feature-detects/video/autoplay.js 它仍然会产生一些开销(因为即使编码为base64的小视频也会占用大量空间)，但这是一个可行的解决方案。 You could implement a routi

...

从iOS 6.1开始，不再可以在iPad上自动播放视频。 我猜他们为什么禁用了自动播放功能？ 好吧，由于许多设备所有者在他们的设备上有数据使用/带宽限制，我认为Apple认为用户自己应该决定何时启动带宽使用。 经过一些研究后，我在Apple文档中发现了以下有关iOS设备自动播放的摘录，以确认我的假设： “Apple决定通过脚本和属性实现来禁用在iOS设备上自动播放视频。 在Safari中，在iOS(适用于所有设备，包括iPad)上，用户可能位于蜂窝网络上并按数据单元收费，因此禁用预加载和自动播放。

...

这是所有iOS设备上的任何音频或视频禁用自动播放，这是Apple的决定。 以下是文档的链接，说明播放必须由用户控制： http ： //developer.apple.com/library/safari/#documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations。 HTML＃// apple_ref / DOC /

...

您无法在正常模式下在iOS上自动播放视频和音频，您可以使用模拟用户输入等技巧来自动播放视频和音频。 Safari HTML5音频和视频指南 在iOS上的Safari(适用于所有设备，包括iPad)中，用户可能位于蜂窝网络上并按数据单元收费，因此禁用预加载和自动播放。 在用户启动数据之前，不会加载任何数据。 这意味着JavaScript play()和load()方法在用户启动回放之前也处于非活动状态，除非用户操作触发play()或load()方法。 换句话说，用户启动的播放按钮可以工作，但onLo

...