Javascript HTML/JS“；“锁定/隐藏”；截止日期设置的内容

我有一个HTML5/CSS页面，我想在某个特定日期之前隐藏/禁用/锁定该页面上的内容

有没有人知道HTML5/JS有什么方法可以做到这一点，并且在可以查看之前可能会显示消息

请询问您是否需要有关该功能的更多说明

提前感谢

对于HTML

控件（为了制作一个不可编辑的表单），您可以在应用程序代码或JS的输入上设置

禁用

或

只读

属性

对于其他内容，您应该（从服务器）以您希望的方式在页面中呈现它。如果有人想远程查看，页面中的所有内容都可以查看/或黑客攻击

因此，将锁放在提供它的服务器上，不要指望页面上的任何锁都能得到保证。

这把小提琴将页面锁定10秒，然后锁定器隐藏。 您应该为100%宽度和高度创建溢出div

还要知道解锁时间，你应该把它储存在某个地方，然后去做

 setTimeout(function(){
  //unlock the screen;
 },timeStored-Date.now())

---

其中

timeStored Date.now（）

是等待解锁的毫秒数

谢谢您的评论。您可以使用HTML、CSS和JavaScript来实现这一点

将

-和

-元素作为

-元素的第一个子元素。这样可以确保在日期正确时第一件事就是将其删除。如果等待加载库或将脚本放在页面底部，用户可能会看到它闪烁一段时间

这样做的缺点仍然是，用户必须加载整个页面，即使他看不到它。关于你说这是一个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>

演示

---

你说的“锁”是什么意思？放在实际内容上的简单消息的问题是，任何人都可以通过查看源代码看到整个页面。因此，根据您的使用情况，最好的方法可能是在到达日期之前交付一个完全不同的页面。我使用的是一个iOS应用程序，它使用Webview.ui呈现HTML5/CSS/JS页面，因此查看源代码不成问题，因为我的应用程序不可能做到这一点。：）是否可以将日期设置为毫秒而不是毫秒？确定后，将显示最新消息，然后显示DIV中的内容。此解决方案是显示一个覆盖，隐藏内容，并在“发布”日期在每个页面请求中删除DIV。更好的解决方案是只显示占位符，并从“发布”日期开始交付真正的页面。但这是您的服务器或应用程序必须处理的事情，不能使用客户端技术来完成。对我来说，这听起来是一个可行的解决方案，当然我可以使用它。谢谢你的帮助。

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