Javascript 如何使会话存储更改值_Javascript_Html_Session Storage

Javascript 如何使会话存储更改值

javascript html

Javascript 如何使会话存储更改值,javascript,html,session-storage,Javascript,Html,Session Storage,我正在制作一个网站，对html和JavaScript都是新手。我基本上有一个视频，当你第一次打开网站时，它会占据整个屏幕，一旦视频完成，它就会转换到主页上。我正在尝试使用它，以便您每次只能查看一次。我的问题是，当你切换到另一个页面并返回主页时，你将不得不再次观看视频。顺便说一句，我正在使用会话存储。非常感谢您的帮助 <body class="Video" id="Video"> <div class="video&quo

我正在制作一个网站，对html和JavaScript都是新手。我基本上有一个视频，当你第一次打开网站时，它会占据整个屏幕，一旦视频完成，它就会转换到主页上。我正在尝试使用它，以便您每次只能查看一次。我的问题是，当你切换到另一个页面并返回主页时，你将不得不再次观看视频。顺便说一句，我正在使用会话存储。非常感谢您的帮助

<body class="Video" id="Video">
    <div class="video">
        <video id="myVideo" width="500" muted autoplay>
            <source src="video.mp4" type="video/mp4">
        </video>
    </div>

    <script>

        var x = document.getElementById('myVideo');
        var i = document.getElementById('Home');
        var header = document.getElementById('header');
        var office = document.getElementById('office');
        var work = document.getElementById('work');
        var info = document.getElementById('info');

        var total = 1;
        var count;
        console.log(total, count);
        if (total !== count) {
            sessionStorage.setItem('isNewSession', 'true');
            console.log(sessionStorage.getItem("isNewSession"))
            
            count = 1;
            console.log(total, count);
        }
        if (sessionStorage.getItem("isNewSession") == 'true') {
            sessionStorage.setItem('isNewSession', 'false');
            console.log(sessionStorage.getItem("isNewSession"))



            i.style.overflow = "hidden";
            header.style.visibility = "visiblie";
            office.style.visibility = "hidden";
            work.style.visibility = "hidden";
            info.style.visibility = "hidden";
            footer.style.visibility = "hidden";


            document.getElementById('myVideo').addEventListener('ended', function (e) {

                x.style.visibility = "hidden";
                i.style.visibility = "visible";



                if (i.style.visibility === "visible") {
                    i.style.overflow = "visible";
                    header.style.visibility = "visible";
                    office.style.visibility = "visible";
                    work.style.visibility = "visible";
                    info.style.visibility = "visible";
                    footer.style.visibility = "visible";
                } else {
                    i.style.visibility = "hidden";
                    header.style.visibility = "visible";
                    office.style.visibility = "hidden";
                    work.style.visibility = "hidden";
                    info.style.visibility = "hidden";
                    footer.style.visibility = "hidden";
                }

            })
        }
        else {
            x.style.visibility = "hidden";
        }
    </script>

</body>


var x=document.getElementById（'myVideo'）；
var i=document.getElementById（'Home'）；
var header=document.getElementById（'header'）；
var office=document.getElementById（'office'）；
var work=document.getElementById（'work'）；
var info=document.getElementById（'info'）；
var总计=1；
var计数；
console.log（总计、计数）；
如果（总计！==计数）{
setItem（'isNewSession'，'true'）；
log（sessionStorage.getItem（“isNewSession”））
计数=1；
console.log（总计、计数）；
}
if（sessionStorage.getItem（“isNewSession”）=“true”）{
setItem（'isNewSession'，'false'）；
log（sessionStorage.getItem（“isNewSession”））
i、 style.overflow=“隐藏”；
header.style.visibilie=“visiblie”；
office.style.visibility=“隐藏”；
work.style.visibility=“隐藏”；
info.style.visibility=“隐藏”；
footer.style.visibility=“hidden”；
document.getElementById（'myVideo'）。addEventListener（'ended'，函数（e）{
x、 style.visibility=“隐藏”；
i、 style.visibility=“可见”；
如果（i.style.visibility==“可见”）{
i、 style.overflow=“可见”；
header.style.visibility=“可见”；
office.style.visibility=“可见”；
work.style.visibility=“可见”；
info.style.visibility=“可见”；
footer.style.visibility=“可见”；
}否则{
i、 style.visibility=“隐藏”；
header.style.visibility=“可见”；
office.style.visibility=“隐藏”；
work.style.visibility=“隐藏”；
info.style.visibility=“隐藏”；
footer.style.visibility=“hidden”；
}
})
}
否则{
x、 style.visibility=“隐藏”；
}

这些行：

    var total = 1;
    var count;
    console.log(total, count);
    if (total !== count) {
        sessionStorage.setItem('isNewSession', 'true');
        console.log(sessionStorage.getItem("isNewSession"))
        
        count = 1;
        console.log(total, count);
    }

将始终运行，因为

total！==开始计数。由于它总是运行，因此它将isNewSession
更改为'true'
，从而使下一个代码块也运行。我不确定它打算做什么；如果total
和count
不做任何其他事情，您可能应该删除整个部分
删除后，您可以更改以下内容：
    if (sessionStorage.getItem("isNewSession") == 'true') {

到
在这种情况下，如果未设置sessionStorage
，或者该值不是“false”
，则将运行该命令，这些行包括：
    var total = 1;
    var count;
    console.log(total, count);
    if (total !== count) {
        sessionStorage.setItem('isNewSession', 'true');
        console.log(sessionStorage.getItem("isNewSession"))
        
        count = 1;
        console.log(total, count);
    }

将始终运行，因为total！==开始计数。由于它总是运行，因此它将isNewSession
更改为'true'
，从而使下一个代码块也运行。我不确定它打算做什么；如果total
和count
不做任何其他事情，您可能应该删除整个部分
删除后，您可以更改以下内容：
    if (sessionStorage.getItem("isNewSession") == 'true') {

到
在这种情况下，如果未设置sessionStorage
，或者该值不是“false”
，它将运行，但如果我设置会话存储，它会一直重置回true，那么我如何才能永久更改它您正在下一行设置：sessionStorage.setItem（'isNewSession'，'false'））
。如果你刷新页面，它应该保持不变。非常感谢各位idk为什么我没有想到这一点，但如果我设置会话存储，它会一直重置为true，那么我如何才能永久更改它呢？你正在下一行设置：sessionStorage.setItem（'isNewSession'，'false'）
。如果你刷新页面，它应该保持不变。非常感谢大家idk为什么我没有想到这一点