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

Question

我正在创建一个用户问候消息，它根据时间向用户发送诸如早安、下午好和晚安之类的消息。一切正常，但我想知道如何在显示一次后隐藏消息直到白天更改，并在消息更改的当天时间再次显示消息。例如，当您早上第一次打开网站时，它只会问候您一次早安信息，然后每次刷新页面时都不会显示此问候信息，直到下一天下午或晚上开始，并且反之亦然。这可能吗？

Answer 1

是的，您可以使用 Simple LocalStorage（用于维护显示的最后一条消息历史记录）和Javascript 中的日期时间比较来完成此操作

<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>

Answer 2

您可以为此使用模态来在用户访问平台时显示问候语。将上次登录时间存储在 cookie 中，并在他们每次登录时访问该时间，并向他们提供适当的问候语。