Javascript 如何在用户每次返回主页时停止播放背景视频？

我收到了一个设计，当用户点击主页时需要加载背景视频。我意识到这不是最佳实践，但设计已经得到客户的认可，因此我试图为其开发一个体面的解决方案。我有视频，它工作得很好

我还被要求确保视频只在用户访问站点时加载一次，并且在用户浏览站点时加载一次，如果他们回到家中，视频不应再次播放

我一直在网上搜索，但找不到这样的先例。有人能提出一个可行的解决方案吗？或者一些我可以访问SourceOne的文档

该网站是用HTML、CSS和JQuery编写的

我很感激没有任何代码可看，但如果有任何建议，我将不胜感激

感谢所有偶然发现这一点的人

使用或：

假设您有一个id为的视频元素，例如：

。。。

您的脚本可能如下所示：

if (!localStorage.getItem('alreadyPlayedVideo')) {
  const myVideo = document.getElementById('myVideo');
  myVideo.play();
  localStorage.setItem('alreadyPlayedVideo', true);
}

---

与

会话存储

相同。这两者之间的主要区别在于，当用户退出浏览器或关闭选项卡时，

sessionStorage

会被清除，而

localStorage

会在会话之间持续存在。

您必须检查用户是否已经在站点上，因此您必须将此数据保存在某个位置，数据可以保存在

会话、数据库、，本地存储或在cookie中

在这种情况下，使用cookies是最好的选择。Cookie存储在客户端，可用于会话和状态管理

与JS一起使用Cookie

function setCookie(cookieName, cookieValue, expireDays,isGlobal) {
            var expireDate = new Date();
            expireDate.setTime(d.getTime() + (expireDays*24*60*60*1000));
            var expires = "expires="+expireDate.toUTCString();
            if(isGlobal){
                document.cookie = cookieName + "=" + cookieValue + "; " + expires+"; path=/";
            }else{
                document.cookie = cookieName + "=" + cookieValue + "; " + expires;
            }
        }

        function getCookie(cookieName) {
           var name = cookieName + "=";
           var ca = document.cookie.split(';');
           for(var i=0; i<ca.length; i++) {
             var c = ca[i];
             while (c.charAt(0)==' ') c = c.substring(1);
               if (c.indexOf(name) == 0) return c.substring(name.length, c.length);
            }
          return "";
     }

    function checkCookie(cookieName) {
        if (getCookie(cookieName) != "") {
            return true;
        } else {
            return false;
        }
    }

    $(document).ready(function(){
      if(checkCookie('visited')){
         //Stop playing video
      }else{
        setCookie('visited',1,3,false);
        //Play video automatically
      }
    });

函数setCookie（cookieName、cookieValue、expireDays、isGlobal）{
var expireDate=新日期（）；
expireDate.setTime（d.getTime（）+（expireDays*24*60*60*1000））；
var expires=“expires=“+expireDate.toutString（）；
如果（isGlobal）{
document.cookie=cookieName+“=”+cookieValue+”；“+expires+”；path=/”；
}否则{
document.cookie=cookieName+“=”+cookieValue+”；“+过期；
}
}
函数getCookie（cookieName）{
变量名称=cookieName+“=”；
var ca=document.cookie.split（“；”）；
对于（var i=0；iYou可以使用
window.sessionStorage
存储一个标志来检查用户是否已经在该页面上。谢谢，我现在将对此进行研究。感谢您抽出时间。：）您不需要太多代码：
if（sessionStorage.VideoPlayed！=“true”）{sessionStorage.setItem（“VideoPlayed”，true）/*code自动启动视频*/}
还有其他选项-一个适用于浏览器会话，因此下次访问时将再次播放（这可能/可能不需要）-或者您可以设置一个cookie并检查它，它将在浏览器实例中保持不变。谢谢，视频现在会在访问者第一次访问站点时加载，我现在可以进一步开发它，以确保当用户返回页面时热点不会重新出现。谢谢您的帮助。