2017-05-03 7 views
0

ブラウザでウェブサイトを開いた時刻に基づいてJSイベントを簡単に素早く開始できるかどうかを確認するためのヘルプを探しています。時刻を基準にしたjavascriptイベントの発生

私がやりたいことは、基本的には午後5時から5時の間にユーザーの現地時間帯がこのスクリプトを持っています。スクリプトは、現在、ページの本体のクラスを「ナイトモード」に単に切り替えるボタンに配線されています。私は、2人が調和して作業し、時間に基づいて自動化し、暗くて明るいテーマが必要な場合はボタンでオーバーライドする機能を使用したいと思います。

function toggleClass(element, className) { 
if (!element || !className) { 
    return; 
} 
var classString = element.className, 
    nameIndex = classString.indexOf(className); 
if (nameIndex == -1) { 
    classString += ' ' + className; 
} else { 
    classString = classString.substr(0, nameIndex) + classString.substr(nameIndex + className.length); 
} 
element.className = classString; 
} 

document.getElementById('day-btn').addEventListener('click', function() { 
    toggleClass(document.getElementById('body'), 'night'); 
}); 

https://jsfiddle.net/simpson/57xe333n/2/

答えて

1
var time = new Date(); 
element = document.getElementById('body'); 
className = "night"; 
console.log(time.getHours()); 
if(time.getHours() > 17 || time.getHours < 5) { 
    if (!element || !className) { 
     return; 
    } 
    var classString = element.className, 
     nameIndex = classString.indexOf(className); 
    if (nameIndex == -1) { 
     classString += ' ' + className; 
    } else { 
     classString = classString.substr(0, nameIndex) + classString.substr(nameIndex + className.length); 
    } 
    element.className = classString; 
} 

これは、システムから引く日付の機能に建てられたのJSのを使用しています。 int(0-23)を返すgetHours()関数を実行します。 if文(time.getHours() > 17 || time.getHours < 5)は、午後5時以降、または午前5時前の場合にのみコードを実行し、テーマを変更します。これがあなたを始められることを願っています。

関連する問題