首页 > 解决方案 > Javascript调度每天显示一次功能

问题描述

嗨,朋友们,我需要您对某个主题的帮助,我有子弹出广告的主题。我希望此广告每天仅展示 1 次。

<script>
//<![CDATA[
setTimeout(function() {
    document.getElementById('popup-box').classList.remove('is-hide');
    document.body.className += " popup-flow-box"
}, 7000);

function removeClassonBody() {
    var element = document.body;
    element.className = element.className.replace(/\bpopup-flow-box\b/g, "")
}
//]]>
</script> 

标签: javascript

解决方案


请注意,由于沙盒,代码不会在 StackOverflow 的代码段编辑器上运行。将其复制/粘贴到 JSFiddle 或类似的工作示例中。

添加了按钮以显示切换效果。

const lastUseValue = localStorage.getItem('last-use');

if (!lastUseValue || (Date.now() - lastUseValue) > 1000 * 60 * 60 * 24) {
  document.body.classList.add('show-pop-up');

  localStorage.setItem('last-use', Date.now());
}

document.querySelector('button').addEventListener('click', e => {
  localStorage.removeItem('last-use');
})
.pop-up {
  display: none;
}

body.show-pop-up .pop-up {
  display: unset;
}
<div class="pop-up">
  I'm an ad!
</div>

<button>Clear last use</button>


推荐阅读