繁体   English   中英

基于日期和时间,显示/隐藏元素

[英]Based on date and time, show/hide element

我想根据多个日期和时间在页面上显示和隐藏一个元素。 例如,我有一个警报框,我想在太平洋标准时间上午 9 点到下午 12 点之间显示以下日期 4/28、4/29 和 4/30。 并隐藏剩下的几个小时。 发布的代码适用于开放和关闭时间,但我不确定如何添加多个日期。 或者我只是错过了一些东西。

编辑:我很讨厌 jQuery/JavaScript。

HTML

<div class="open openstatus">Open</div>
<div class="closed openstatus">Closed</div>

JS

var now = new Date(),
  currentDay = now.getDay(),
  openTime = new Date(
    now.getFullYear(),
    now.getMonth(),
    now.getDate(),
    13,
    02
  ),
  closeTime = new Date(
    now.getFullYear(),
    now.getMonth(),
    now.getDate(),
    13,
    03
  ),
  open = now.getTime() > openTime.getTime() && now.getTime() < closeTime.getTime();

  if (currentDay !== 6 && currentDay !== 0 && open) {
      $('.openstatus').toggle();
  }

我会做这样的事情:

HTML

<div id="alertBox">My alert box</div>

JAVASCRIPT

function myFunc(){

    var d = new Date(); //client Date
    d.setMinutes(d.getMinutes() + d.getTimezoneOffset()); //To get current GMT time
    d.setHours(d.getHours() - 8); // This is time in PST

    var day = d.getDay(),
        month = d.getMonth(),
        hours = d.getHours(),
        dateOfMonth = d.getDate();

    var prohibbittedMonth = 4;
    var prohibbittedDates =[28, 29, 30];
    var showAlertBox = false;

    if(day === 0 || day === 6){
        showAlertBox = true; // If the day is Saturday or Sunday
    }else if(month = prohibbittedMonth && prohibbittedDates.includes(dateOfMonth) && !(hours >= 0 && hours <9)){
        showAlertBox = true;     
    }
     // You may combine the above two condition in a single line. I have just separated them for better readability.

    if(!showAlertBox){
        document.getElementById('alertBox').style.display = "none";  //You may use your jquery here if you like
    }else{
        document.getElementById('alertBox').style.display = ""; //You may use your jquery here if you like
    }
}

myFunc();

你不能像这样添加某事 currentDate=now.getDate();

if (currentDay !== 6 && currentDay !== 0 && open && (currentDate==28||currentDate==29||currentDate==30) )

这将检查 currentDate 是否为 28 或 29 或 30。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM