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

Question

我正在创建一个用户问候消息，它根据时间向用户发送诸如早安、下午好和晚安之类的消息。一切正常，但我想知道如何在显示一次后隐藏消息直到白天更改，并在消息更改的当天时间再次显示消息。

例如，当您早上第一次打开网站时，它只会问候您一次早安信息，然后每次刷新页面时都不会显示此问候信息，直到下一天下午或晚上开始，并且反之亦然。

这可能吗？

Answer 1

是的，您可以使用 Simple LocalStorage（用于维护显示的最后一条消息历史记录）和Javascript 中的日期时间比较来完成此操作<script>&nbsp; &nbsp; setInterval(greet , 1000*60);&nbsp; &nbsp; function greet(){&nbsp; &nbsp; &nbsp; &nbsp; var date = new Date();&nbsp; &nbsp; &nbsp; &nbsp; try{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(!localStorage.lastGreeted || !localStorage.lastGreetedPeriod)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; greetWithMessage(date);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; else if(getDate(localStorage.lastGreeted)!=getDate(date))&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; greetWithMessage(date);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; else if(divideDayTime(date.getHours())!=localStorage.lastGreetedPeriod)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; greetWithMessage(date);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; catch(err){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;greetWithMessage(date);&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }&nbsp; &nbsp; function getDate(obj){&nbsp; &nbsp; &nbsp; &nbsp; if(!(obj instanceof Date) )&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; obj = new Date(obj);&nbsp; &nbsp; &nbsp; &nbsp; return obj.getDate()+'-'+(1+obj.getMonth())+'-'+obj.getFullYear();&nbsp; &nbsp; }&nbsp; &nbsp; function divideDayTime(hours){&nbsp; &nbsp; &nbsp;//Update Message and It's Period Here&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; if(hours<12)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return 'MORNING';&nbsp; &nbsp; &nbsp; &nbsp; else if(hours>=12 && hours <=16)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return 'AFTERNOON';&nbsp; &nbsp; &nbsp; &nbsp; else if(hours>16 && hours<=20)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return "EVENING";&nbsp; &nbsp; &nbsp; &nbsp; else&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return "NIGHT";&nbsp; &nbsp; }&nbsp; &nbsp; function greetWithMessage(d){&nbsp; &nbsp; &nbsp; &nbsp; localStorage.lastGreeted=d;&nbsp; &nbsp; &nbsp; &nbsp; var message = localStorage.lastGreetedPeriod=divideDayTime(d.getHours());&nbsp; &nbsp; &nbsp; &nbsp; alert("Good "+ message);&nbsp; &nbsp; }&nbsp; &nbsp; </script>

Answer 2

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