2017-08-26 8 views
1

私は新しいプログラミング言語であり、 ここに入力タグhtmlにjavascriptの結果(日付)を配置する方法についてお尋ねします。入力タグ内の日付の違いによる結果を表示するjavascriptの結果を表示

結果が入力タグ内に表示されないようです。ここ

は、私が書いた関数である:

function updatesum() { 
    var d1= new Date(document.getElementById("d1").value;); 
    var d2 = new Date(document.getElementById("d2").value;); 
    var total = (d2.getDate() - d1.getDate())/30 + 
d2.getMonth() - d1.getMonth() + 
(12 * (d2.getFullYear() - d1.getFullYear())); 
    // alert(total); 
    document.getElementById("txtTotal").value = total; 
    return false; 
} 

、これはHTMLフォームです:

<br> 
<form name="input" action="#" method="get" onsubmit="return false;" > 
Start date:<input class= "d1" type="text" name="d1" value="" id="d1" /> 
End Date:<input class="d2" type="text" name="d2" value="" id="d2" /> 
<br> 
<br> 
Total Month in fraction:<input type="text" name="total" value=" " 
id="txtTotal"/> 
<input type="submit" value="Submit" onclick="updatesum()"/> 
</form> 

関数の結果は、入力フォームである必要があり

https://jsfiddle.net/syafieqq/c8L68bjj/2/

更新正解

http://jsfiddle.net/syafieqq/69m3LkLv/4/

答えて

1

あなたはあなたのコードのタイプミスがあります。

<header> date format ex: 2010/11/23</header> 
 
<br> 
 
<form name="input" action="#" method="get" onsubmit="return false;" > 
 
    Start date:<input class= "d1" type="text" name="d1" value="" id="d1" /> 
 
    End Date:<input class="d2" type="text" name="d2" value="" id="d2" /> 
 
    <br> 
 
    <br> 
 
    Total Month in fraction:<input type="text" name="total" value=" " id="txtTotal"/> 
 
    <input type="submit" value="Submit" onclick="updatesum()"/> 
 
</form> 
 

 
<script> 
 
    function updatesum() { 
 
    var d1= new Date(document.getElementById("d1").value); // was value;); removed inner ; 
 
    var d2 = new Date(document.getElementById("d2").value); // was value;); removed inner ; 
 

 
    var total = (d2.getDate() - d1.getDate())/30 + 
 
     d2.getMonth() - d1.getMonth() + 
 
     (12 * (d2.getFullYear() - d1.getFullYear())); 
 
    // alert(total); 
 
    document.getElementById("txtTotal").value = total; 
 
    return false; 
 
    } 
 
</script>

+0

うわー、その作業を..私はそのタイプミスを実現いけない、おかげでたくさん...私のローカルサーバーで既にテストされていますが、私はちょうど、なぜ、jsfiddleで結果が表示されないのでしょうか? –

+0

htmlの 'onclick'属性を使用しているときにjsfiddleのjavascriptセクションにjavascriptを書き込まないでください。javascriptセクションに書き込む場合はjavascriptの' addEventListener'イベントを使用してください。 htmlの 'onclick'を使用する場合は、HTMLと同じページの' script'タグにjavascriptを書き込みます。 –