开放时间

编程入门 行业动态 更新时间:2024-10-25 10:31:19
开放时间 - DIV取决于星期几和小时(Opening hours - DIV depends on the day of the week and the hour)

我有一个脚本,根据星期几和一天中的时间显示不同的div。 他运作良好。 我需要修改它。 我想每天设置不同的开放时间。 我怎样才能做到这一点? 请帮忙。

星期一开放时间为8:00至16:00 周二开放时间为8:00至16:00 周三开放时间为8:00至18:00 周四开放时间为8:00至18:00 周五开放时间为8:00至16:00 周六关闭 周日开放时间为8:00至13:00

我的剧本:

var d = new Date();
var dayOfWeek = d.getDay();
var hour = d.getHours();
var mins = d.getMinutes();
var status = 'open';

if (dayOfWeek !== 6 && dayOfWeek !== 0 && hour >= 9 && hour <= 15){
    if (hour=='9' && mins < '00'){
        status = 'closed';
    }else if (hour=='15' && mins > '30'){
        status = 'closed';
    }else{
        status = 'open';
    }
}else{
    status = 'closed';
}

if (status=='open') {
    $('.hours').show();
    $('.closed').hide();
}else{
    $('.hours').hide();
    $('.closed').show();
} 
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="hours">We are OPEN</div>
<div class="closed">We are CLOSED</div> 
  
 

I have a script that shows different div depending on the day of the week and the time of day. He works well. I need to modify it. I want to set different opening hours each day. How can I do this? Please help.

Example

Monday open from 8:00 to 16:00 Tuesday open from 8:00 to 16:00 Wednesday open from 8:00 to 18:00 Thursday open from 8:00 to 18:00 Friday open from 8:00 to 16:00 Saturday close Sunday open from 8:00 to 13:00

My script:

var d = new Date();
var dayOfWeek = d.getDay();
var hour = d.getHours();
var mins = d.getMinutes();
var status = 'open';

if (dayOfWeek !== 6 && dayOfWeek !== 0 && hour >= 9 && hour <= 15){
    if (hour=='9' && mins < '00'){
        status = 'closed';
    }else if (hour=='15' && mins > '30'){
        status = 'closed';
    }else{
        status = 'open';
    }
}else{
    status = 'closed';
}

if (status=='open') {
    $('.hours').show();
    $('.closed').hide();
}else{
    $('.hours').hide();
    $('.closed').show();
} 
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="hours">We are OPEN</div>
<div class="closed">We are CLOSED</div> 
  
 

最满意答案

您可以构造一个数组来表示一周中的每一天,并在其中包含打开/关闭小时。

另外,我会更改你的“status”变量来存储一个布尔值,而不是一个字符串,因为它有效地回答了“是或否”的问题 - 为什么不把它称为“打开”并使其值为真或假? 挑剔,但这种方式更正确。 字符串比较很笨拙。

var openHours = [ { openHour: 8, openMinute: 0, closeHour: 13, closeMinute: 0 }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: -1, openMinute: -1, closeHour: -1, closeMinute: -1, } ]; var d = new Date(); var dayOfWeek = d.getDay(); var hour = d.getHours(); var mins = d.getMinutes(); var open = true; var todayHours = openHours[dayOfWeek]; if (hour >= todayHours.openHour && hour <= todayHours.closeHour) { if ((hour==todayHours.openHour && mins < todayHours.openMinute) || (hour==todayHours.closeHour && mins > todayHours.closeMinute)) { open = false; } else { open = true; } } else { open = false; } if (open) { $('.hours').show(); $('.closed').hide(); } else { $('.hours').hide(); $('.closed').show(); }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="hours">We are OPEN</div>
<div class="closed">We are CLOSED</div>

You can construct an array to represent each day of the week, and include the open/close hour within it.

Also, I'd change your "status" variable to store a boolean, not a string, since it's effectively answering a "yes or no" question - why not just call it "open" and make its values true or false? Nit-picky, but this way is more correct. String comparisons are clunky.

var openHours = [ { openHour: 8, openMinute: 0, closeHour: 13, closeMinute: 0 }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: 9, openMinute: 0, closeHour: 17, closeMinute: 30, }, { openHour: -1, openMinute: -1, closeHour: -1, closeMinute: -1, } ]; var d = new Date(); var dayOfWeek = d.getDay(); var hour = d.getHours(); var mins = d.getMinutes(); var open = true; var todayHours = openHours[dayOfWeek]; if (hour >= todayHours.openHour && hour <= todayHours.closeHour) { if ((hour==todayHours.openHour && mins < todayHours.openMinute) || (hour==todayHours.closeHour && mins > todayHours.closeMinute)) { open = false; } else { open = true; } } else { open = false; } if (open) { $('.hours').show(); $('.closed').hide(); } else { $('.hours').hide(); $('.closed').show(); }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="hours">We are OPEN</div>
<div class="closed">We are CLOSED</div>

                    
                     
          

更多推荐

本文发布于:2023-08-01 16:50:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1361305.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:时间

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!