Question

我的网站有A，B，C，D页。在开始页面 - A - 有一个html5视频，设置为自动播放。所以vid开始加载页面。视频播放一次，在结尾处显示播放再次按钮。到目前为止这很好。如果我访问B页或C页然后再次转到A，视频将再次启动。但我想每位访客只启用一次自动播放。这应该是这样的：一个访问网页，从第A页开始，一次看视频，转到第B或C或D页，再回到A（使用链接或后退按钮）;并找到再次播放按钮，而不是再次播放视频。

编辑：

感谢您使用Cookie的想法;现在我了解到，在欧洲这里有一条法律，你必须告诉访客使用cookies，并在开始页面给他一个选择，他想接受它们。

所以我想为此目的使用window.sessionStorage。

这是我的代码，告诉视频要设置在autoplay = false和播放再次按钮以显示.on（＆＃34;结束＆＃34;，...

$(document).ready(function () {
    $("video").on("ended", function() {     
    $('video')[0].autoplay=false
    $('video')[0].load()
    $('.video-playing').removeClass('video-playing').addClass('video-wait');
    $('.play').removeClass('hide_play');
    });

    $('.play').click(function(){
    $('video')[0].play();
    $('.video-wait').removeClass('video-wait').addClass('video-playing');
    $('.play').addClass('hide_play');
    });
});

HTML

<video id="header-video" class="video-playing" preload="auto" poster="">
    <source src="" type="video/mp4">
    <source src="" type="video/webm">
</video>

我的目标是：从第B页或第C页回到首页 - A - （见上文）该课程＆＃39; .video-playing＆＃39;应该设置为＆＃39; .video-wait＆＃39;，＆＃39; .play＆＃39;到＆＃39; hide_play＆＃39;并自动播放到＆＃34; false＆＃34;。

我认为使用sessionStorage对我来说是最好的，因为在打开一个新窗口时它应该从头开始。

不幸的是我不知道如何在我的代码中实现sessionStorage。

link：www.2015.peter-martin-golf.de

Answer 1

您必须保存用户已在现场的某个位置，您可以将其保存到会话，数据库，localStorage或cookie中。我建议使用cookie，因为它在客户端（所以你不需要修改你的数据库或用php设置会话）。

使用Cookie

然后用户进入第A页：

SwingWorker

Answer 2

您必须设置Cookie以确定用户是否已访问过，并且您必须在javascript中控制自动播放。 Brightcove有一个很棒的HTML5视频库来做这样的事情，叫做video.js。有了它，您可以创建一个js Player对象，其中包含您需要的所有内容。因此，假设您使用jQuery，您可以执行以下操作：

var myPlayer = videojs('idOfVideo');

if (!!$.cookie('return-user')) {
    myPlayer.autoplay(true);
} else {
    myPlayer.autoplay(false);
    $.cookie('return-user', {
        expires: 365
      });
}

HTML5视频自动播放/播放一次

2 个答案: