如何在每隔一定时间间隔后显示一次div

时间:2019-06-08 18:34:08

标签: javascript php html css setinterval

我正在创建一个用户问候消息,该消息会根据时间向用户发送“早上好”,“下午好”和“晚上好”之类的消息。.一切正常,但是我想知道在显示一次后如何隐藏消息,直到一天中的时间发生了变化,并且随着消息中的一天中的时间发生了变化,再次显示该消息。

例如,当您第一次在早上打开网站时,它只会向您发送一次“早安”消息,然后每次刷新页面时才显示此问候消息,直到一天的下一部分开始,例如下午或晚上,反之亦然。

这可能吗?

2 个答案:

答案 0 :(得分:1)

您可以为此使用模式来在用户访问平台时显示问候语。将上次登录时间存储在cookie中,并在每次登录时对其进行访问并提供适当的问候语。

答案 1 :(得分:1)

是的,您可以使用 JavaScript

中的简单 LocalStorage (用于保留显示的最后一条消息的历史记录)和日期时间比较来执行此操作
<script>
    setInterval(greet , 1000*60);
    function greet(){

        var date = new Date();
        try{
            if(!localStorage.lastGreeted || !localStorage.lastGreetedPeriod)
                greetWithMessage(date);
            else if(getDate(localStorage.lastGreeted)!=getDate(date))
                greetWithMessage(date);
            else if(divideDayTime(date.getHours())!=localStorage.lastGreetedPeriod)
                greetWithMessage(date);
        }
        catch(err){

             greetWithMessage(date);
        }

    }



    function getDate(obj){
        if(!(obj instanceof Date) )
            obj = new Date(obj);
        return obj.getDate()+'-'+(1+obj.getMonth())+'-'+obj.getFullYear();
    }

    function divideDayTime(hours){
     //Update Message and It's Period Here 
        if(hours<12)
            return 'MORNING';
        else if(hours>=12 && hours <=16)
            return 'AFTERNOON';
        else if(hours>16 && hours<=20)
            return "EVENING";
        else 
            return "NIGHT";

    }
    function greetWithMessage(d){
        localStorage.lastGreeted=d;
        var message = localStorage.lastGreetedPeriod=divideDayTime(d.getHours());

        alert("Good "+ message);
    }


    </script>