javascript - HTML/JS "Lock/Hide"内容直到日期设置

标签 javascript html

我有一个 HTML5/CSS 页面,我想在某个日期之前隐藏/禁用/锁定内容。

有没有人知道任何 HTML5/JS 的方式来执行此操作并可能在查看可用之前显示一条消息。

请询问您是否需要对该功能进行更多说明。

提前致谢

最佳答案

感谢您的评论。您可以使用此 HTML、CSS 和 JavaScript 来使它正常工作。

放置 <div> - 和 <script> - 作为您的第一个 child 的元素 <body> -元素。这样可以确保在日期合适时首先将其删除。如果您等待加载库或将脚本放在页面底部,用户可能会看到它闪烁了一会儿。

这样做的缺点仍然是,用户必须加载整个页面,即使他看不到它。关于你说这是一个 iOS 应用程序,你可以引入一个解决方案,只要需要,就只加载锁定的屏幕,以避免不必要的流量。

HTML + JavaScript

<div class="locked" id="locked"></div>
<script>    
    var end = new Date('2013-01-01');
    var now = new Date();
    if (end - now <= 0) {
        var e = document.getElementById('locked');
        e.parentElement.removeChild(e);
    }
</script>

CSS

div.locked {
    position: fixed;
    z-index: 100000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: red;
}

演示

Try before buy

关于javascript - HTML/JS "Lock/Hide"内容直到日期设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18695651/

相关文章:

html - 如何将html保存到数据库字段

javascript - 如果文本不在 html 标签内,如何在单击时获取文本值?

html - 如果不适合父 div 宽度,则在子 div 中自动换行

php - 使用 php 在 head 标签内设置一个 css 属性

javascript - Wagerfield 的示例看起来与源代码不同

javascript - React - onClick 用于动态生成的组件

javascript if 或语句

javascript - 如何去除页面的白边并使其 100% 宽

java - 在 Java 中运行 Javascript 表单请求

javascript - 什么时候使用 .val() 与 .innerHTML?