sou
10/20/2017 - 8:26 AM

時間指定 要素表示・非表示 ※要jQuery

時間指定 要素表示・非表示 ※要jQuery

$(document).ready(function() {
  $(".view_timer").each(function(index, target) {
    var startDate = $(this).attr("data-start-date");
    var endDate = $(this).attr("data-end-date");
    var nowDate = new Date();

    if (startDate) {
      startDate = new Date(startDate);
    } else {
      startDate = nowDate;
    }
    if (endDate) {
      endDate = new Date(endDate);
    }

    if (startDate <= nowDate && (!endDate || nowDate <= endDate)) {
      $(this).show();
    } else {
      $(this).hide();
    }
  });
});
■指定した時間まで表示する(2/15 0:00 から非表示にする)
<span class="view_timer" data-end-date="2017/2/15 0:00"></span>

■指定した時間までは非表示(2/15 0:00 から表示する)
<span class="view_timer" data-start-date="2017/2/15 0:00"></span>

■指定した期間だけ表示する(2/15 0:00 ~ 2/16 0:00 の間だけ表示する)
<span class="view_timer" data-start-date="2017/2/15 0:00" data-end-date="2017/2/16 0:00"></span>