我不太熟悉JavaScript并正在尝试为Square Space网站设置年龄验证弹出窗口。我在Yes/No按钮功能上遇到了困难，无法弄清如何使它们正常工作。想法是当单击“Yes”时，弹出窗口消失，并且该选择将在该会话的剩余时间内保留。当单击“No”时，网站退出。非常感谢您的帮助。
我已将以下代码粘贴到整个站点的头部代码注入中：
我已将以下代码粘贴到整个站点的头部代码注入中：
jQuery(document).ready(function($) {
if (sessionStorage.getItem('advertOnce') !== 'true') {
//sessionStorage.setItem('advertOnce','true');
$('.box').show();
} else {
$('.box').hide();
};
$('#btn-alpha').click(function() {
sessionStorage.setItem('advertOnce', 'true');
$('.box').hide();
});
$('#btn-beta').click(function() {
window.location.href = 'http://google.com/';
});
});/*----------------------------------------------
-Defualt to border-box
----------------------------------------------- */
*,
*:before,
*:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
html,
body {
font-family: helvetica;
font-size: 100%;
margin: 0;
padding: 0;
font-weight: 400;
font-family: Raleway;
line-height: 1.4;
}
/*----------------------------------------------
--Fluid body sizing
----------------------------------------------- */
body {
font-size: 100%;
}
@media (min-width: 32em) {
body {
font-size: 110%;
}
}
@media (min-width: 54em) {
body {
font-size: 111%;
}
}
@media (min-width: 74em) {
body {
font-size: 115%;
}
}
@media (min-width: 96em) {
body {
font-size: 135%;
}
}
a.btn {
background-color: #e3c827;
color: #000;
text-decoration: none;
display: inline-block;
letter-spacing: 0.1em;
padding: 0.5em 0em;
}
a.btn.btn-beta {
background-color: #800000;
}
.overlay-verify {
background: #000;
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: 1;
}
.box {
background: #fff;
position: relative;
left: 0;
right: 0;
top: 20%;
bottom: 0;
margin: 0 auto;
z-index: 9;
width: 70%;
height: 40%;
display: table;
}
.box .box-left,
.box .box-right {
width: 100%;
position: relative;
text-align: center;
padding: 5%;
}
@media (min-width: 54em) {
.box .box-left,
.box .box-right {
display: table-cell;
vertical-align: middle;
width: 50%;
}
}
.box .box-left p,
.box .box-right p {
position: relative;
z-index: 3;
}
.box .box-left {
background: url(https://www.distillery.news/wp-content/uploads/2018/03/84743_Hochatown-2.jpg) 50% 50%;
background-size: cover;
}
.box .box-left img {
position: relative;
z-index: 1;
width: 9em;
}
.box .box-left:after {
content: '';
position: relative;
z-index: 0;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0);
}
.box .box-right {
background-color: #000000;
text-align: center;
}
.box .box-right h3 {
color: #fff;
text-transform: uppercase;
letter-spacing: 0.07em;
border-bottom: 1px solid #eee;
padding-bottom: 1em;
margin: 0 auto;
}
.box .box-right p {
color: #fff;
}
.box .box-right small {
color: #fff;
}
.box .box-right .btn {
font-weight: 600;
letter-spacing: 0.2em;
padding: 0.9em 1em 0.7em;
margin: 1em auto;
display: block;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<main>
<article class="box">
<div class="box-left">
</div>
<div class="box-right">
<h3>Age Verification</h3>
<p>This site requires you to be 21 years or older to enter. </p>
<p>By clicking 'YES', I certify that I am 21 years or older.</p>
<a href="#" class="btn btn-alpha" id="refresh-page">YES</a>
<a href="#" class="btn btn-beta" id="refresh-page">NO</a>
</div>
</article>
<div class="overlay-verify"></div>
</main>
<a href="test.html">创建的纯链接即可。您需要记住Yes被点击的原因吗？ - Gosi</div>。 - disinfor