日付の配列が現在の週に該当するかどうかをチェックする方法

私はMoment.jsを使用して、現在の週の日付の配列を生成しています。日付の配列が現在の週に該当するかどうかをチェックする方法

は、私は今、私はMoment.jsに対するこれらの日付の一致のいずれかが現在の週を作成したかどうかを確認したい、システムから日付の配列を取得しています。

yesの場合、私はので、私は、DOMがそれに応じてオブジェクトを操作することができます。..それらの値（0,1,2を返すしたいと思います（例：。試合は現在の週の日曜日と火曜日を返すならば、私はそれらを強調表示します）

私はこれまでのところ、それは日付が現在の週に該当する場合は、単一のハードコーディングされた値が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

出典

2017-08-23 user366123

あなたはhighlightDays配列の現在の週の日付を強調するためにjQueryのAttribute Equals Selector [name="value"]と瞬間format()を使用することができます。

format()にddddトークンを使用すると、data-day属性の値であるSunday Monday ... Friday Saturdayが得られます。

EDIT：docs状態として、ため、問題は、日曜日のために間違った結果を与えたisWithinThisWeek方法であった：

チェックモーメントは、必要に応じて単位のスケールで（分を見て、他の二つの瞬間の間にある場合、時間、日など）。 マッチは排他的です。

その後、両方を使用することができます。

isBetween(moment-like, moment-like, String, String)はそれを包括的にするよう規定引数を[]を渡します。
isSame(Moment|String|Number|Date|Array, String)ここ粒度パラメータとして生き例

を週を渡す：私の答えは、すでに掲載2に似ていますが、

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>

を：

私は使わない私はHTML

出典

2017-08-23 10:38:10 VincenzoC

私もnumToDays配列を使用しません; – hallleron

@hallleron確かに、HTMLの要素の順序に頼っています:) – VincenzoC

あなたの助けてくれてありがとうございますが、日曜日を強調表示できません。 – user366123

EDIT：は固定します日曜日の強調表示のバグ。 isBetween()の呼び出しでは、をstartOfWeekから1日にしなければなりませんでした。

私は、これはあなたが欲しいものだと思う：

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"> 
 
\t \t <tbody> 
 
\t \t <tr> 
 
\t \t \t <td data-day="sunday">Sunday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="monday">Monday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="tuesday">Tuesday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="wednesday">Wednesday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="thursday">Thursday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="friday">Friday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t <td data-day="saturday">Saturday</td> 
 
</tr> 
 
\t \t </tbody> 
 
\t \t </table>

私が最後にfor()ループを追加し、日付があなたの関数を使用して、現在の週であるかどうかを確認します。これを使用して、addClass()を使用して一致するレコードを強調表示します。

出典

2017-08-23 10:20:35 hallleron

これは今日だけか、将来のある日を強調、しかし素晴らしいです。今週もまだ過去の日は強調表示されません。 – user366123

それは、見て、私は4つのエントリとして昨日の日付を追加しました...それは動作します – hallleron

おかげであなたの助けになります。心から感謝する。しかし、私は週のすべての日をハイライトすることはできません...おそらくMoment.js週の問題？ – user366123

ここはあなたの後です。 foreachループとintを曜日に変換する単純な配列を追加しました。次に、data-dayに基づいて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))){ 
 
    \t 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"> 
 
\t \t <tbody> 
 
\t \t <tr> 
 
\t \t \t <td data-day="sunday">Sunday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="monday">Monday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="tuesday">Tuesday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="wednesday">Wednesday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="thursday">Thursday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t \t \t <td data-day="friday">Friday</td> 
 
\t \t </tr> 
 
<tr> 
 
\t <td data-day="saturday">Saturday</td> 
 
</tr> 
 
\t \t </tbody> 
 
\t \t </table>

出典

2017-08-23 10:26:01 Deckerz

あなたの助けに感謝しますが、日曜日を強調表示することができません。 – user366123

の要素の順序に依存しないnumToDays一時配列

私は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; 
 
}

出典

2017-08-23 10:40:47 riot

私はmoment.jsにこだわりたいと思いますが、私はまだあなたの助けに感謝します。 – user366123

日付の配列が現在の週に該当するかどうかをチェックする方法

答えて

関連する問題