我有一个称为“ alert-box-close”的div,它将显示在页面上,并在X上关闭,并在1分钟后重新出现(仅出于测试目的,此后的到期时间为30天)。
问题是我有三个需要同一个div的页面,但是如果其中一个页面关闭了它,那么如果打开另一个页面则应该显示它。使用此代码,只有在指定的时间到期时,每页中的代码才会重新出现。 如何纠正呢? 先感谢您。
$(document).ready(function() {
// Add hours function
Date.prototype.addHours = function(h) {
this.setTime(this.getTime() + 60000); // 60 seconds for testing
return this;
}
//Hide div click
$('.alert-box-close').click(function() {
//Get time after 24 hours
var after24 = new Date().addHours(10).getTime();
//Hide div
$('#alert-box-news').hide(300);
//Set desired time till you want to hide that div
localStorage.setItem('desiredTime', after24);
});
//If desired time >= currentTime, based on that HIDE / SHOW
function checkStorage() {
var currentTime = new Date().getTime();
if (localStorage.getItem('desiredTime') >= currentTime) {
$('#alert-box-news').hide();
} else {
$('#alert-box-news').show();
}
}
//Check logic on load
checkStorage();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="alert-box-news" class="alert-box alertboxone alerthidden">
<img src="https://no-cache.hubspot.com/cta/default/4409803/2e194850-79d4-4b68-bd48-dc8e559edd96.png"/>
<img class="alert-box-close closeone" id="close-alert-box-news" src="https://www.atakinteractive.com/wp-content/uploads/2018/11/closeiframe.png">
</div>