如何检查日期数组是否属于当前周

Question

我正在使用 Moment.js 生成本周的日期数组。

然后我从系统中获取一个日期数组，现在我想检查这些日期中的任何一个是否与本周创建的 Moment.js 匹配。

如果是，那么我想返回它们的值（0,1,2.. 所以我可以相应地操作 dom 对象。（例如：如果匹配返回本周的星期日和星期二，那么我会突出显示它们）

到目前为止，我只获得了一个硬编码值，以在日期低于当前周时返回 true 或 false。

var REFERENCE = moment();
var startOfWeek = REFERENCE.clone().startOf('week');

var endOfWeek = REFERENCE.clone().endOf('week');
var highlightDays = ['2017-08-23','2017-08-25','2017-08-29']; //highlight respective days ONLY they fall under current week

var days = [];
var day = startOfWeek;

while (day <= endOfWeek) {
    days.push(day.toDate());
    day = day.clone().add(1, 'd');
}


function isWithinThisWeek(momentDate) {
    return momentDate.isBetween(startOfWeek, endOfWeek);

}


console.log("is it within this week?  "+isWithinThisWeek(moment("2017-08-25")));

jsfiddle

Answer 1

您可以使用 jQuery Attribute Equals Selector [name="value"] 和 moment format() 突出显示 highlightDays 数组中当前一周的日期。

在format() 中使用dddd 令牌，您将获得Sunday Monday ... Friday Saturday，这是您的data-day 属性的值。

编辑：问题在于 isWithinThisWeek 方法在周日给出了错误的结果，因为正如 docs 所述：

检查某个时刻是否介于其他两个时刻之间，可选择查看单位规模（分钟、小时、天等）。 比赛是排他性的。

那么你可以同时使用：

• isBetween(moment-like, moment-like, String, String) 传递 [] 作为第四个参数以使其具有包容性。
• isSame(Moment|String|Number|Date|Array, String) 传递周作为粒度参数

这里是一个活生生的例子：

var REFERENCE = moment(); 
var startOfWeek = REFERENCE.clone().startOf('week');
var endOfWeek = REFERENCE.clone().endOf('week');
var highlightDays = ['2017-08-18','2017-08-19','2017-08-20','2017-08-21','2017-08-22','2017-08-23','2017-08-24','2017-08-25','2017-08-26']; //highlight respective days ONLY they fall under current week

var days = [];
var day = startOfWeek;

while ( day.isBefore(endOfWeek) ) {
    days.push(day.toDate());
    day = day.clone().add(1, 'd');
}

function isWithinThisWeek(momentDate) {
    return momentDate.isBetween(startOfWeek, endOfWeek, null, '[]');
    // return momentDate.isSame(REFERENCE, 'week')
}

for(var i=0; i<highlightDays.length; i++){
  var m = moment(highlightDays[i]);
    if( isWithinThisWeek(m) ){
    var dayName = m.format('dddd').toLowerCase();
    $("[data-day='"+dayName+"']").addClass("highlight");
  }
}

.highlight{
  background:yellow;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>

<table class="table">
  <tbody>
    <tr>
      <td data-day="sunday">Sunday</td>
    </tr>
    <tr>
      <td data-day="monday">Monday</td>
    </tr>
    <tr>
      <td data-day="tuesday">Tuesday</td>
    </tr>
    <tr>
      <td data-day="wednesday">Wednesday</td>
    </tr>
    <tr>
      <td data-day="thursday">Thursday</td>
    </tr>
    <tr>
      <td data-day="friday">Friday</td>
    </tr>
    <tr>
      <td data-day="saturday">Saturday</td>
    </tr>
  </tbody>
</table>

我的答案与已经发布的两个类似，但是：

• 我不使用 numToDays 临时数组
• 我不依赖 HTML 中元素的顺序

Answer 2

编辑：修复了周日的突出显示错误。有一天，您必须在 startOfWeek 中通过 isBetween() 呼叫 subtract。

我想这就是你想要的：

var REFERENCE = moment(); 
var startOfWeek = REFERENCE.clone().startOf('week');
var endOfWeek = REFERENCE.clone().endOf('week');
var highlightDays = ['2017-08-20','2017-08-21','2017-08-22','2017-08-23','2017-08-24','2017-08-25','2017-08-26'];

var days = [];
var day = startOfWeek;

while (day <= endOfWeek) {
    days.push(day.toDate());
    day = day.clone().add(1, 'd');
}

function isWithinThisWeek(momentDate) {
    return momentDate.isBetween(startOfWeek.subtract(1, 'd'), endOfWeek.add(1, 'd'));  
}

for(var i = 0; i < highlightDays.length; i++){
console.log(isWithinThisWeek(moment(highlightDays[i])));
  if(isWithinThisWeek(moment(highlightDays[i]))){
    var date_converted = new Date(highlightDays[i]);
    $(".table td:eq("+date_converted.getDay()+")").addClass("highlight");
  }
}

.highlight{
  background:yellow;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone-with-data-2012-2022.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
		<tbody>
		<tr>
			<td data-day="sunday">Sunday</td>
		</tr>
<tr>
			<td data-day="monday">Monday</td>
		</tr>
<tr>
			<td data-day="tuesday">Tuesday</td>
		</tr>
<tr>
			<td data-day="wednesday">Wednesday</td>
		</tr>
<tr>
			<td data-day="thursday">Thursday</td>
		</tr>
<tr>
			<td data-day="friday">Friday</td>
		</tr>
<tr>
	  <td data-day="saturday">Saturday</td>
</tr>
		</tbody>
		</table>

我在最后添加了一个for() 循环，并使用您的函数检查日期是否在本周。使用它，我使用addClass() 突出显示匹配的记录。

Answer 3

这就是你所追求的。我添加了一个 foreach 循环和一个简单的天数组来将 int 转换为日期名称。然后它根据数据日选择td 并突出显示它。

var REFERENCE = moment(); 
var startOfWeek = REFERENCE.clone().startOf('week');
var endOfWeek = REFERENCE.clone().endOf('week');
var highlightDays = ['2017-08-23','2017-08-25','2017-08-29']; //highlight respective days ONLY they fall under current week

var days = [];
var day = startOfWeek;

while (day <= endOfWeek) {
    days.push(day.toDate());
    day = day.clone().add(1, 'd');
}


function isWithinThisWeek(momentDate) {
    return momentDate.isBetween(startOfWeek, endOfWeek);
}

var numToDays = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];

highlightDays.forEach(function(element) {
  if(isWithinThisWeek(moment(element))){
  	var date = moment(element);    
    var day = date.format("d");
    $("td[data-day='"+numToDays[day]+"']").addClass("highlight");
  }
});

.highlight{
  background:yellow;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.13/moment-timezone-with-data-2012-2022.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table">
		<tbody>
		<tr>
			<td data-day="sunday">Sunday</td>
		</tr>
<tr>
			<td data-day="monday">Monday</td>
		</tr>
<tr>
			<td data-day="tuesday">Tuesday</td>
		</tr>
<tr>
			<td data-day="wednesday">Wednesday</td>
		</tr>
<tr>
			<td data-day="thursday">Thursday</td>
		</tr>
<tr>
			<td data-day="friday">Friday</td>
		</tr>
<tr>
	  <td data-day="saturday">Saturday</td>
</tr>
		</tbody>
		</table>

Answer 4

我对 Moment.js 没有信心，但我会尝试使用纯 JS。 也许这会有所帮助。

var highlightDays = ['2017-08-23','2017-08-25','2017-08-29']; //highlight respective days ONLY they fall under current week
var date= new Date(); //Today Date
var today = date.getDay(); //Today Day of the week Number
var dayMSec = 1000 * 60 * 60 * 24; //a day in ms
var weekMSec = dayMSec * 7; // a week in ms

//Here i calculate the start of the week timestamp(Using dates the starting day will be Sunday). TS in in ms
var startWeekTS = date.getTime() - (dayMSec * today); 

highlightDays.forEach(function(val, index){
  if(isWithinThisWeek(val)){
    //just logging
    console.log(highlightDays[index] + ' is within this week');
  }
});


function isWithinThisWeek(date) {
    //generate a Date() from passed arg
    date = new Date(date);
    //getting the ts of the date
    var dateMSec = date.getTime();
    //subtracting start of the week ts and arg ts
    var tsDiff = dateMSec - startWeekTS;
    
    //if ts is between 0 and a week expressed in ms
    if( tsDiff >= 0  && tsDiff< weekMSec){
      //here we go
      return true;
    }
    
    //nope
    return false;
}