【js】イベント期間日付処理関連+html出力サンプル
とあるお仕事で決まった時期でイベント開催されているため、jsで制御できるようにした際のメモになります。
〇〇日から〇〇まで、イベント期間中の表示などで応用できます。
下記のように決まった時間にリダイレクトしています。
【普段】通常告知ページ(30s)→総合トップ
【期間中】通常告知ページ(30s)→イベント告知ページ(30s)→総合トップ
また、通常告知とイベントページにスキップボタンを設定しています。
HTML
<a id="ridaiLink" href="リンク入れてね">動画をスキップする</a>setTimeoutでリダイレクト設定しています。（例は30000ミリ秒→30s）
JS
制御したいイベント期間を入力
startady：イベント開始日
endday：イベント終了日
target：スキップボタンのリンク先書き換え*
*リンク表示↓（例: id名：ridaiLink）
<script>
// イベントの開始、終了設定
var startday = new Date('2024/3/1 00:00:00');
var endday = new Date('2024/3/8 23:59:59');
var target = document.getElementById("ridaiLink")//スキップボタンのリンク先
var today = new Date();
if ( startday < today && today < endday ){
setTimeout(function() {
location.href='リンクを入力';
}, 30000);
target.href = "リンクを入力";
}else{
setTimeout(function() {
location.href='普段のリンクを入力';
}, 30000);
target.href = "普段のリンクを入力";
}
</script>動作しない場合の対処法
- jsの読み込みしているのか
- head内でだめだったら、body閉じまでに移動してみる
- 書き間違い→検証で確認
