1

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

有没有人知道任何 HTML5 / JS 方法可以做到这一点,并可能在查看之前显示一条消息。

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

提前致谢

4

3 回答 3

2

谢谢你的评论。你可以使用这个 HTML、CSS 和 JavaScript 来让这个东西工作。

<div>- 和 -<script>元素作为 - 元素的第一<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;
}

演示

先试后买

于 2013-09-09T10:44:56.710 回答
0

http://jsfiddle.net/SKUJj/ 这个小提琴将页面锁定 10 秒,然后更衣室隐藏。您应该为 100% 的宽度和高度创建溢出的 div。

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

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

timeStored-Date.now()等待解锁的毫秒数在哪里

于 2013-09-09T10:02:55.623 回答
0

对于 HTML<input>控件(制作不可编辑的表单),您可以在应用程序代码或 JS 的输入上设置disabled或属性。readonly

对于其他内容,您应该(从服务器)按照您希望它在页面中的方式呈现它。如果有人远程想要,页面中的所有内容都是可见的/或可破解的。

所以把锁放在提供它的服务器上,不要指望页面上的任何锁都能得到保证。

于 2013-09-09T09:57:55.467 回答