javascript - 年龄验证脚本弹出问题
问题描述
我有用于年龄验证的脚本并将其放在我们的网站上。但是单击按钮是或否后没有反应。任何人都可以检查吗?单击按钮后是 - 我希望弹出窗口消失并且浏览器记住 cookie 并且不再显示。单击后,我不希望脚本将您带到主页。
<script>
$(function() {
//Check it the user has been accpeted the agreement
if (!(document.cookie && document.cookie == "accepted")) {
$("#popup").show();
}
$('[data-popup-close]').on('click', function(e) {
var targeted_popup_class = jQuery(this).attr('data-popup-close');
$('[data-popup="' + targeted_popup_class + '"]').fadeOut(350);
//Set a cookie to remember the state
document.cookie = "accepted";
e.preventDefault();
});
});
#popup {
z-index: 1000;
top: 0;
left: 0;
right: 0;
bottom: 0;
position: fixed;
background-color: rgba(0, 0, 0, 0.8);
}
.verify-window {
position: absolute;
top: 50%;
left: 50%;
width: 300px;
height: 200px;
margin-left: -150px;
margin-top: -100px;
overflow: hidden;
border-radius: 10px;
padding: 20px;
background-color: #fff;
box-sizing: border-box;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}
.verify-window img {
display: block;
width: 250px;
height: 50px;
margin: 0 auto;
padding: 20px;
}
.verify-window h3 {
font-family: 'Roboto', sans-serif;
font-size: 1em;
color: #4d4d4d;
line-height: 1.7;
margin-top: 10px;
text-align: center;
}
.verify-window p {
font-family: 'Roboto', sans-serif;
font-size: 1em;
color: #4d4d4d;
margin-top: 10px;
line-height: 1.7;
text-align: center;
}
.button-yes,
.button-no {
background: #fff;
color: #ADCC21;
width: 20%;
margin-top: 10px;
border: 2px solid #ADCC21;
padding: 12px 17px;
border-radius: 30px;
font-family: 'Roboto', sans-serif;
text-align: center;
font-size: 1em;
}
.button-no {
float: right;
margin-right: 20px;
border: 2px solid #95969a;
color: #95969a;
display: block;
}
.button-yes {
float: left;
margin-left: 20px;
}
.button-yes:hover {
background: #ADCC21;
color: #fff;
transition: all 0.2s ease;
cursor: pointer;
}
.button-no:hover {
background: #95969a;
color: #fff;
transition: all 0.2s ease;
cursor: pointer;
}
<div id="popup" data-popup="popup-1">
<div class="verify-window">
<h3>Weryfikacja wieku</h3>
<p>Ta strona zawiera treści dla dorosłych. Czy masz 18 lat?</p>
<div class="button-yes" data-popup-close="popup-1">Tak</div>
<div class="button-no">Nie</div>
</div>
<!-- // verify window --></div>
<div id="content">
<p>Zawartość strony</p>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
解决方案
推荐阅读
- python - 如何在 rpy2 中使用延迟的 Dask?
- date - 在 presto 中将 bigint 转换为时间戳
- php - Wordpress Shortcode 不会在 html 字符串中返回 vars
- r - 在 R 中使用嵌套循环计算一系列唯一 ID 和天数的最小值和最大值
- r - 将具有不同长度和空元素的嵌套列表的列表转换为R中的数据框
- core-data - 带有谓词swift 3的核心数据获取请求
- javascript - 如何更新 Cloud Firestore js 中的数组
- python - 为 Pandas 中的组分配唯一的数字组 ID
- answer-set-programming - 创建子集并仅使用每个原子一次
- ajax - Chrome.runtime.connect 不再被识别?