2016-06-29 5 views
0

私は、人々が薬を飲むように思い出させるためのアプリを構築しています。アプリは、現在の時間に基づいてユーザーが取るべき薬を表示します。例えば、午前10時に薬1と2を飲む必要がある場合時間は午前10時〜午前10時59分です。チェックボックスには「薬1」と「薬2」と表示され、ユーザーはチェックを入れます。しかし、ユーザが午後9時に薬剤3と薬剤4を服用する必要がある場合は、午後9時〜午後9時59分にチェックボックスに「薬剤3」と「薬剤4」と表示されます。現在の時間に基づいて異なるチェックボックス名を表示する方法は?

私は現在持っているHTML:今あなたはアプリは関係なく、ユーザーがアプリを開く何時間ちょうど薬1及び薬2が表示されません見ることができるよう

   <div id=aa style="display:none"> 
     <form> 
      <input type="checkbox" name="Medication 1" value="one">Supplement One<br> 
      <input type="checkbox" name="Medication 2" value="two">Supplement Two<br> 
      <input id=xbutton type="button" onClick="validate()" value="Submit"> 
     </form> 

    </div> 

。チェックボックスに現在の時間に基づいて異なる単語を表示させる方法はありますか?

+0

JavaScriptコードを挿入できますか? –

+0

私はこの機能のためのjavascriptコードを持っていません。私はそれを行う方法がわかりません。 validate()関数は、すべてのチェックボックスがチェックされているかどうかを確認するだけです。 – michelle9090

答えて

2

これは単なるデザインです。なお、以下にそのうちの1つは、いくつかの方法を通じて行うことができます。

使用JavaScriptが現在の時間を取得するために

var dt = new Date(); 
var time = dt.getHours(); 

は(多くのクリーナー)はjQueryで

をも行うことができますあなたはすべて含めることができますあなたのHTMLで最初にチェックボックスをオンが、今、あなたはセットアップJSのように、それに応じて動作するようにすることができます彼らのdisplay: none;

を設定します。

If(time > 9 && time < 10) //9am-10am 
{ 
    $('#medication1').css('display','block'); 
    $('#medication2').css('display','block'); 
} 

このように、他の期間にjsを設定することができます。 特定のチェックボックスを設定する前に、すべての投薬チェックボックスにdisplay: none;を設定してください。display: block;これにより、以前に表示されたチェックボックスはクリアされます。

+0

ありがとう!このようにすることは決して考えなかった! :) – michelle9090

関連する問題