2016-07-27 7 views
0

こんにちは、現在の時刻に基づいて異なるチェックボックスを表示できるかどうか疑問に思っています。私は投薬リマインダーアプリケーションを構築しているので、アプリケーションは現在の時間に基づいてユーザーが取るべき異なる投薬を表示します。したがって、例えば1pmで、チェックボックスには「投薬A」、「投薬C」と表示されることがあります。そして、午後9時にはチェックボックスに "投薬B"が表示されることがあります。時刻に基づいて異なるチェックボックスを表示する

これは私が現時点で持っているものですが、わかるように、現在の時刻に関係なく同じチェックボックスが表示されます。

<form> 
<input type="checkbox" name="Med A" value="A">Medication A<br> 
<input type="checkbox" name="Med B" value="B">Medication B<br> 
<input type="checkbox" name="Med C" value="C">Medication C<br> 
<input id=xbutton type="button" onClick="validate()" value="Submit"> 
</form> 

答えて

2

ページが読み込まれると、時間を確認して表示を設定できます。

JS:

var hour = (new Date()).getHours(); 

showMed('A', hour == 13); 
showMed('B', hour == 21); 
showMed('C', hour == 13); 

function showMed(med, show) { 
    document.getElementById('med' + med).style.display = show ? '' : 'none'; 
} 

HTML:

<form> 
<div id='medA'> 
    <input type="checkbox" name="Med A" value="A">Medication A 
</div> 
<div id='medB'> 
    <input type="checkbox" name="Med B" value="B">Medication B 
</div> 
<div id='medC'> 
    <input type="checkbox" name="Med C" value="C">Medication C 
</div> 
</form> 

ページがすでにロードされているので、もしあなたがしばらく一度のテスト関数を実行するにはJavaScriptののsetIntervalを使用することもできますし、時間の変更あなたのページ/ビューが更新されます。

フィドル:https://jsfiddle.net/y3v3njq2/2/あなたが時間を確認し、関数内ではなく、関数にブール値を渡しているどのように私は好き

+1

。 – Zze

+0

ありがとう、それを試してみましょう! – michelle9090

関連する問題