Question

可以在一小时内向访问者显示页面标题中的div吗？

我想展示一个向访客显示我们是开放还是关闭的栏。 “访客A”应该在他加载的每个第一页上看到它，而不是在下一页上看到它。应该在30分钟内再次向他展示。

我正在我的网站上运行jquery 1.10.2。

感谢您的想法

Answer 1

假设你的div有id="specialContent"，这样的话（在文档加载之后，在你的$(document).ready(function() { ... } );或其他任何地方）都可以做到这一点......

function showSpecialContent() {
    $('#specialContent').show();
    setTimeout(hideSpecialContent, 1000*30); // show the content for 30 seconds, then hide it
    document.cookie = "lastshown=" + Date.now();
}

function hideSpecialContent() {
   $('#specialContent').hide();
   setTimeout(showSpecialContent, 1000*60*60); // hide the content, and then show it again in an hour
}

function initTimers() { 
    var lastShown = getCookie("lastshown");
    if(lastShown) {
        var lsd = new Date(new Number(lastShown));

        var timeShownDelta = Date.now() - lsd;
        // if we last showed the div more than an hour ago
        if (timeShownDelta > 60*60*1000) {   
            showSpecialContent();
        } else {
            setTimeout(showSpecialContent, 1000*60*60 - timeShownDelta); 
        }

    } else {
        showSpecialContent();
    }
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for(var i=0; i<ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1);
        if (c.indexOf(name) != -1) return c.substring(name.length,c.length);
    }
    return "";
}

initTimers();

和更新的小提琴：http://jsfiddle.net/vj2dqqyr/4/

Answer 2

您可以这样做：

小提琴：http://jsfiddle.net/fns6e7yc/1/

<div id='showOnceAnHour' style='display: none'>
    Something to show  
</div>

在你的剧本中：

$(document).ready(function() {
    setInterval(function() {
        $("#showOnceAnHour").fadeIn().delay(10000).fadeOut();
    }, 60*60*1000);
});

Answer 3

你可以使用cookies，设置一个持续一个小时的cookie，然后用你的代码做一些检查：

如果Cookie存在不，则显示div，创建Cookie并使其持续一小时
如果存在，则不执行任何操作

我不认为你可以直接用jQuery处理cookie，但是有一些插件可用。或者，您可以使用服务器端编程语言，例如PHP。

这取决于你想要展示的内容。如果它只是一个广告或提醒（例如：看看我们的圣诞促销），那么您可以在每个小时显示它。在你的jQuery脚本中，检查时间，如果它是＆＃34; round＆＃34;小时（不知道该怎么说）比如7：00,8：00或其他东西，显示div，然后在一分钟后隐藏它等等。

PHP示例

<?php 
    if(!isset($_COOKIE['yourCookie']))
    {
        //Set the cookie
        setcookie("yourCookie", "open", time() + 3600); //Expires in an hour            
        echo '<div class="open">We are open!</div>';            
    }
?>

当您重新加载页面时，Cookie将存在，因此div将不会显示。一小时后，cookie将被删除，因此下次用户刷新页面时将显示该cookie，并且将再次设置cookie。

服务器端解决方案的缺点是，除非用户在一小时后刷新页面，否则在一小时之后就不会像使用Javascript一样显示。

修改您必须在输出任何HTML之前设置Cookie ，否则会失败！确保设置cookie的说明在代码中的任何HTML之前。

每小时只显示div内容一次

3 个答案:

PHP示例