HTML要素を20時から08時まで非表示にするGMT

ボタンをウェブページから12時間隠すにはどうすればよいですか？これは今まで私が持っているものです：HTML要素を20時から08時まで非表示にするGMT

var now = new Date(); 
var millisTill20 = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 20, 0, 0, 0) - now; 

if (millisTill20 < 0) { 
    millisTill20 += 86400000; 
} 
console.log('millisTill20 ' + millisTill20); 

setTimeout(function() { 
    $("#button_online").hide(); 
}, millisTill20);

20時にスクリプトが実行されますが、要素は非表示になりますが、ページを更新するとボタンが戻ってきます。

別の問題が発生しました。ユーザーが20:01に私のウェブサイトにアクセスすると、ボタンが表示されますが、どうすればこの問題を解決できますか？これは私がクライアント側スクリプトを使用しているが、Salesforceを使用しているためにサーバー側を使用できないためです。

出典

2017-02-08 Dante

現在の時刻を確認し、それを表示するためにJSを使用し、その後、CSSを使用して、デフォルトで要素を非表示にします。それ以降は定期的に再チェックしてください。 – Blazemonger

より良い解決策は、1秒または10秒または60秒（任意の解像度に応じて）とその時間を確認する内部にsetTimeoutすることです – slebetman

決定されたユーザーは、いつでも手動で要素を強制的に表示することができます。サーバーサイドのコードだけが完全にそれを防ぐことができます。 – Blazemonger

は、以下のコードはsetTimeoutメソッドを使用せずに、仕事を行います（）。

var currentDate = new Date(); 
var currentHour = currentDate.getHours(); 

if(currentHour>19 || currentHour<9) { 
    $("#button_online").remove(); // it is better to remove than hide, beacuse someone on client side can still use the button if it is there. 
}

次に、getHours W3上の（）関数：http://www.w3schools.com/jsref/jsref_gethours.asp

上記のコードは、ページロードのボタンを削除します。

しかし、このような状況があることができます：

それは午後7時59分だと、クライアントがページをロードし、ボタンは削除されません。 20時ですが、19時59分にページがロードされているので、ボタンはまだそこにあります。

あなたもこのような状況を確認したい場合は、関数内で上記のコードをラップし、periodiclyそれを繰り返すことができます。

$(document).ready(function() { 
    checkTheTime(); 
}) 

function checkTheTime() { 
    var currentDate = new Date(); 
    var currentHour = currentDate.getHours(); 

    if(currentHour>19 || currentHour<9) { 
     $("#button_online").remove(); // it is better to remove than hide, beacuse someone on client side can still use the button if it is there. 
    } 

    setTimeout(checkTheTime, 1000);// period=1 second; 
}

出典

2017-02-08 14:14:59

私はこれについて少し考え方を変える必要があると思います。これは特定の時間にボタンを隠すことになりますが、リロードなどを処理しません。ロード時に表示または非表示にする必要があります。ユーザーがページを開いていてナビゲートしていない場合、スクリプトはボタンを非表示にします。現在時刻が、これらの時間の間であるし、ボタンを取り除く場合

チェック：

var d = new Date(); 
if (d.getHours() >= 20 && d.getHours() < 8) { 
    $("#button_online").remove(); 
}

出典

2017-02-08 14:13:43

この1つは完全に罰金

var b; 
 
function checkBtn(){ 
 
    b=setTimeout(checkTime,1000); // check in every second 
 
} 
 
function checkTime(){ 
 
    var btn = document.getElementById('btn'); 
 
    var d = new Date(); 
 
    d = d.getHours(); 
 
    if(d >= 20 || d<= 8){ 
 
     btn.style.display="none"; 
 
     clearTimeout(b); 
 
    } 
 
    else{ 
 
     btn.style.display=""; 
 
     checkBtn(); 
 
    } 
 
}

<body onload="checkBtn();"> 
 
<input type="button" id="btn" />

出典

2017-02-08 14:15:07

作品コードの下にsetIntervalを使用して毎秒の時刻をチェックします。現在の時間が8〜20の場合はボタンを表示し、それ以外の場合は非表示にします。

function checkOnlineAvailability() { 
 
    var now = new Date(); 
 
    var hour = now.getHours(); 
 
    // remove the following line, only present for testing various random hours 
 
    hour = parseInt(Math.random()*24); 
 
    if (hour >= 8 && hour < 20) { 
 
    console.log(hour + 'h is within the available time frame'); 
 
    $('#button_online').show(); 
 
    } else { 
 
    console.log(hour + 'h is NOT within the available time frame'); 
 
    $('#button_online').hide(); 
 
    } 
 
} 
 

 
checkOnlineAvailability(); 
 
setInterval(checkOnlineAvailability, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="button_online">ONLINE</button>

出典

2017-02-08 14:22:45

のではなく、すべての開始/終了時間の計算を行う、ちょうどGMTの時間を取得します。それが> 20、または<の場合、要素を非表示にします。それ以外の場合は、表示してください。

function checkOnline() { 
 
    var el = document.getElementById('button_online'); 
 

 
    var hours = (new Date()).getUTCHours(); 
 

 
    if ((hours >= 20) || (hours < 8)) 
 
    el.style.display = 'none'; 
 
    else 
 
    el.style.display = ''; 
 
} 
 

 
// set correct state on page load 
 
checkOnline(); 
 

 
// re-check once per minute 
 
setInterval(checkOnline, 60000);

<button id=button_online>button</button>

出典

2017-02-08 14:23:02

より効率的にするには、次の変更時刻までの期間の95％の間隔で* setTimeout *を使用して関数を呼び出すことができます。 :-) – RobG

HTML要素を20時から08時まで非表示にするGMT

答えて

関連する問題