我有這個很好的腳本,它可以讓我只顯示未來日期的專案,但是從這里我試圖點擊只顯示周末的日期。
密碼筆
$('#basicform_checkbox_2').click(function(e) {
$('.div1').each(function(index, element) {
var event_day = $(this).text();
event_day = new Date(event_day);
var today = new Date();
event_day.setHours(0,0,0,0)
today.setDate(today.getDate() 0);
today.setHours(0,0,0,0)
if(event_day < today) {
$(this).toggleClass('toggle');
}
});
});
body {font-family: 'Ubuntu', sans-serif; font-weight: 400; color: white; background: black;}
div {margin-left: 3vmax;}
.div1 {display: block;}
.div1.toggle {display: none;}
<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
<br>
<div>
<input type="checkbox" name="basicform_checkbox_2" id="basicform_checkbox_2"/>
<label for="basicform_checkbox_2">Weekends only</label>
</div>
<br>
<div class="div1">2022 06 08</div>
<div class="div1">2022 06 09</div>
<div class="div1">2022 06 10</div>
<div class="div1">2022 06 11</div>
<div class="div1">2022 06 12</div>
<div class="div1">2022 06 15</div>
<div class="div1">2022 06 18</div>
我知道我必須使用類似的東西
var today = data.getDay();
if (today == 6 || today == 0) {
或者
var today = new Date();
if(today.getDay() == 6 || today.getDay() == 0) alert('Weekend!');
或者
var DayOfTheWeek = new Date().getDay();
if(DayOfTheWeek == 6 || DayOfTheWeek == 0){ $('#div1').hide(); }
或者
var days_to_hide = { 0 : "Sunday", 6 : "Saturday" }
var today = new Date().getDay();
if( typeof days_to_hide[ today ] !== "undefined" ){ $('#div1').hide(); }
但是我似乎無法將其中的任何內容合并到我的腳本中,也無法將它們改編成新的腳本以滿足任務的要求——不是因為缺乏嘗試,而是因為對基礎知識的了解不足。
感謝您的關注!
uj5u.com熱心網友回復:
您需要檢查它是否不是未來或 (||) 它不是任何周末。我將您的示例重構為:
const isNotFutureWeekend = (date) => {
const weekends = [0,6]
const eventDay = new Date(date)
eventDay.setHours(0,0,0,0)
const today = new Date();
today.setHours(0,0,0,0)
return eventDay < today || !weekends.includes(eventDay.getDay())
}
$('#basicform_checkbox_2').click(function(e) {
$('.div1').each(function(index, element) {
if(isNotFutureWeekend($(this).text())) {
$(this).toggleClass('toggle');
}
});
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/489721.html
標籤:javascript html jQuery 日期
上一篇:如何洗掉jquery中的附加元素
