JavaScriptからのフォームからの時間経過計算

Question

私は、ユーザーが月、日、年に入力した時間経過計算機で作業しています。彼らの入力と現在の日付から、何日の間に何日かを計算して、何年、何ヶ月、および何日が経過したかを表示したいと思います。私は、「月」、「日」、「年」の3つの入力値を持つフォームを作成することから始めました。私はその後、スクリプトを開始：

function timeElapsed() { 
     var timeMonth = document.getElementById("month"); 
     var timeDay = document.getElementById("day"); 
     var timeYear = document.getElementById("year"); 
     var currentDate = new Date(); 
     var elapsed = 
     document.getElementById("timeElapsed").innerHTML = elapsed; 
    } 
     //Event Listener 
     var submitButton= document.getElementById("sButton"); 
    if (submitButton.addEventListener) { 
     submitButton.addEventListener("click", timeElapsed, false); 
    } else if (submitButton.attachEvent) { 
     submitButton.attachEvent("onclick", timeElapsed); 
    } 

明らかに私はここからどこに行くのかに困惑していると言うことができます。これは私のための学校のラボです。私はそれをどうやって行うのか理解したいだけです。私の先生はと言っています。あなたのプログラムには、31日を超える月の値と12月の12月の月を変換するコードが含まれている必要があります。と私は実際には完全に混乱していますが、彼が何を意味するのか理解しています。実際にこれを実際に行う方法を実際に理解しているだけです。それはWebクラスであり、単なる教科書から理解することは非常に難しいです。私は少しオンラインを見てきましたが、自分の状況に役立つものは何も見つかりませんでした。あなたが私を助けてくれたら、どうもありがとう。

Answer 1

がjavascriptでは、あなたがここで

if(currentMonth < inputMonth) { 
    monthBetween = inputMonth - currentMonth; 
} else if(currentMonth > inputMonth) { 
    monthBetween = currentMonth - inputMonth; 
} else { 
    monthBetween = 0; 
} 

のようないくつかの基本的な数学演算を実行する必要があり、あなたの入力日付フィールドから値を取得した後

var currentDate = new Date(); 
var currentMonth = currentDate.getMonth() + 1; // as it starts from 0 
var currentDay = currentDate.getDate(); 
var currentYear = currentDate.getFullYear(); 

として現在の日付を取得することができますいくつかのサンプルコードは、あなたができることです周りを遊び、学ぶ。ここでhttps://jsfiddle.net/8pd5f3pe/1/

Answer 2

は、あなたが ``新しい日付（年、月 - 1日）から日付を作成することによって開始することができますあなたが

function get(ID){ 
 
    return document.getElementById(ID); 
 
} 
 

 
function calculateDiff(){ 
 
    var FromYear \t = get('FromYear').value; 
 
    var FromMonth = get('FromMonth').value; 
 
    var FromDay \t = get('FromDay').value; 
 

 
    var ToYear \t = get('ToYear').value; 
 
    var ToMonth \t = get('ToMonth').value; 
 
    var ToDay \t = get('ToDay').value; 
 
\t 
 
    var date1 \t = new Date(FromYear,FromMonth,FromDay); /*Create Date Object From date*/ 
 
    var date2 \t = new Date(ToYear,ToMonth,ToDay);   /*Create Date Object To date*/ 
 
    var diff \t = new Date(date2.getTime() - date1.getTime()); 
 

 
    get('ResultYear').value = diff.getUTCFullYear()-1970; /*Calculate year difference*/ 
 
    get('ResultMonth').value = diff.getUTCMonth();   /*Count month difference*/ 
 
    get('ResultDay').value = diff.getUTCDate()-1;   /*Count day difference*/ 
 
} 
 

 
calculateDiff(); 
 

 
var calculate = get('calculate'); 
 

 
calculate.onclick = function(){ 
 
    calculateDiff(); 
 
}

table input{ 
 
    width: 60px; 
 
} 
 
button{ 
 
    width: 80%; 
 
    margin: 10px auto; 
 
}

<table border="1"> 
 
    <tbody> 
 
    <tr class="header"> 
 
     <th>&nbsp;</th> 
 
     <th>YYYY</th> 
 
     <th>MM</th> 
 
     <th>DD</th> 
 
    </tr> 
 
    <tr> 
 
     <th>FROM</th> 
 
     <td><input id="FromYear" placeholder="YYYY" value="2017"></td> 
 
     <td><input id="FromMonth" placeholder="MM" value="3"></td> 
 
     <td><input id="FromDay" placeholder="DD" value="18"></td> 
 
    </tr> 
 
    <tr> 
 
     <th>TO</th> 
 
     <td><input id="ToYear" placeholder="YYYY" value="2017"></td> 
 
     <td><input id="ToMonth" placeholder="MM" value="3"></td> 
 
     <td><input id="ToDay" placeholder="DD" value="29"></td> 
 
\t </tr> 
 
    <tr> 
 
     <th colspan="4"> 
 
     <button id="calculate">Calculate</button> 
 
     </th> 
 
    </tr> 
 
    <tr> 
 
     <th>RESULT</th> 
 
     <td><input id="ResultYear" placeholder="YYYY" value=""></td> 
 
     <td><input id="ResultMonth" placeholder="MM" value=""></td> 
 
     <td><input id="ResultDay" placeholder="DD" value=""></td> 
 
    </tr> 
 
    </tbody> 
 
</table>