2017-03-29 5 views
0
<form> 
<table> 
    <tr> 
     <!--starting time is enter by user--> 
     <th>Start Time:</th> 
     <td><input type="time" name="startTime"></td> 
    </tr> 
    <tr> 
     <!--interval is select by user--> 
     <th>Interval:</th> 
     <td> 
      <select name="interval" > 
       <option value="30 minutes">30 minutes</option> 
       <option value="1 hours">1 hours</option> 
      </select> 
     </td> 
    </tr> 
    <tr> 
     <th>End Time:</th> 
     <td> 
     <!-- show end time here 
     and data should be readonly(not editable) --> 
     </td> 
    </tr> 
</table> 
</form> 

開始時刻と間隔を選択した後、終了時刻は更新(startTime &間隔を追加)する必要があります。開始時間と間隔からのデータは残るべきです。だから私はそれが終了時間の変数を更新したいだけです。それをどうすれば実現できますか?PHP/HTMLの特定の変数のみを更新する

入力タイプ:ボタンを使用して終了時間を更新しようとしました。ただし、開始時刻と間隔データが更新されます。

+2

私にお気軽によりのように思えますJavascript/Jquery problem then PHP – MaD

+0

yesはjavascript dでのみ行うことができますなぜPHPのタグがわからないのですか? – Gert

答えて

1

サイト自体をリロードせずにサイトを変更する場合は、javascriptはjaceryを使用する必要があります。これは、javascriptはクライアント側のみであり、ユーザは値をすべて単独で変更できるからです。 (しかしそれでもサーバ自体は何も変わらないだろう)。

あなたは、フォーム、私は何かが変更されるたびに更新するJavaScriptを書いた後

<td><input type="time" name="startTime" id="startTime" onchange="changeTime()"></td> 

<select name="interval" id="interval" onchange="changeTime()"> 
    <option value="30">30 minutes</option> 
    <option value="60">1 hours</option> 
</select> 

<th>End Time:</th> 
    <td> 
    <p id="endTime"></p> 
    </td> 

にいくつかのことを変更する必要があり、このようにそれをしたい場合。私は実際に入力されたタイプの時間を処理する方法がわからないので、私は配列にして、それを分割して、ちょうどそれらの値を更新します。

<script> 
function changeTime(){ 
    var startTime = document.getElementById("startTime").value; 
    startTime = startTime.split(":"); 
    var hours = startTime[0]; 
    var minutes = startTime[1]; 
    var interval = document.getElementById("interval").value; 

    minutes = parseInt(minutes)+parseInt(interval); 

    if (minutes > 60) { //check if an hour should be added 
     minutes-= 60; 
     hours++; 
    } 
    document.getElementById("endTime").innerHTML = hours+":"+minutes; 
} 

その後、あなたが送信している場合値をサーバーに渡しても、値を取得してPHPファイルにロードすることはできますが、これはクライアント側ではないため、ユーザーは再ロードせずに直接見ることはありません。ここで

は、私がここで使用いくつかのことです。

Split

GetElementByID

More Infos about Javascript

それとも、開いているすべての質問がある場合は、