2

我正在为广播电台建立一个网站,并想显示当前正在播出的主持人。我已经构建了一个 Web 应用程序,其中包含有关演示者的数据:姓名、照片、简历和每个工作日的开始/结束时间。

<div id="presenter1">
    <div class="slot">
        <div id="sunday-off"> - </div>
        <div id="monday-afternoon">12:00 - 15:59</div>
        <div id="tuesday-afternoon">12:00 - 15:59</div>
        <div id="wednesday-afternoon">12:00 - 15:59</div>
        <div id="thursday-afternoon">12:00 - 15:59</div>
        <div id="friday-afternoon">12:00 - 15:59</div>
        <div id="saturday-morning">06:00 - 08:59</div>
    </div>
</div>

我想做的是使用 Javascript 函数 getDay() 和 getHours() + getMinutes() 来仅显示根据应用程序中指定的时间安排播出的演示者。

我遇到困难的主要部分是确定此演示者是否在当前时间范围内,然后根据需要显示/隐藏 div。

任何有关我如何实现这一目标的帮助或指导将不胜感激。

4

2 回答 2

2

您可以按如下方式与 getHours 和 getDay 函数进行比较,您不必担心分钟函数,因为它们都位于小时的边界上。请记住那一天是从星期日开始索引的 0

//Hide all the divs up here
var d = new Date();
var weekday = d.getDay();
var hours = d.getHours();
//    between 12 and 6pm           From monday  to friday
if (hours >= 12 && hours < 18 && weekday > 0 && weekday < 6) {
   switch(weekday) {
      case 1:
          //Show monday
          break;
      case 2:
          //Show tuesday
          break;
      case 3:
          //Show wed
          break;
      case 4:
          //Show thur
          break;
      case 5:
          //Show fri
          break;
    }
//          Saturday         between 6 and 9
} else if (weekday == 6 && hours >=6 && hours < 9) {
  //Show saturday
} else if (weekday == 0) {
  //Show sunday
}

编辑:根据您的要求,这是一个简单的模块化实现

var schedule = [
    {"starthour":12, "endhour":18, "weekday":1, "div":"div1"},
    {"starthour":18, "endhour":20, "weekday":1, "div":"div2"}
]
var d = new Date();
var weekday = d.getDay();
var hours = d.getHours();
var i;
for (i = 0; i < schedule.length; i++) {
    if (schedule[i].starthour >= hours && schedule[i].endhour < hours && schedule[i].weekday == weekday) {
        //Show schedule[i].div
    }
}
于 2012-11-25T22:47:57.700 回答
0

如果您已经在使用 jQuery 库。我建议您使用日期库来更容易阅读代码并且更易于维护 http://archive.plugins.jquery.com/project/jquery-dateFormat

timenow = $.format.date( new Date(), 'ddd h:mm a')
// returns Monday 6:22 AM

switch(timenow){
case 'Monday 1:00 PM':
    //do something
    break;
case 'Tuesday 3:00 PM':
    //do something
    break;
}

那么如果它总是在一小时内,只需省略分钟。使用格式'ddd h a' 所以你可以用 SWITCH 编写你的 JavaScript

timenow = $.format.date( new Date(), 'ddd h a')
// returns Monday 6 AM

switch(timenow){
case 'Monday 1 PM':
case 'Monday 2 PM':
    //do something
    break;
case 'Tuesday 3 PM':
    //do something
    break;
}

但是如果你不使用 jquery,而你只想使用 getDay(),纯 javascript

var days =["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"];
var d = new Date();
var hr = d.getHours() % 12;

timenow = days[d.getDay()] + ' ' + hr + (d.getHours() > 12?'PM':'AM')

// returns "Monday 2PM"

注意事项:通过 AJAX 获取您当前的演示者来处理数据库

于 2012-11-25T22:25:48.127 回答