2016-09-28 12 views
0

フォームの「入力」ステートメントに日付を追加する方法についてここで質問したいだけです。日付を選択すると、日数が7ずつ増え、タイプが「入力」ステートメントに表示されます。ここに私のコードです。日付を選択すると、日数を7で加算しますか?

just click this link, to view the image.

<html> 
<head> 
<title>Date Sample</title> 
</head> 
<body> 
<form> 
Start Date:<br/> 
<input type="date" name="sdate" id="sdate"/> 
<br/> 
End Date:<br/> 
<input type="date" name="edate" id="edate"/> 
</form> 
</body> 
</html> 

答えて

0
  • Date

  • を必要得るためにchangeリスナー

  • 使用DateObj.getDateDateObj.setDate方法を添付を設定するYYYY-MM-DDDateObjをフォーマット

注:そのユーザがその値を編集することはできませんので、私はend-dateためreadonly属性を追加しました。

$('#sdate').change(function() { 
 
    if (this.value) { 
 
    var d = new Date(this.value); 
 
    var newDate = d.setDate(d.getDate() + 7); 
 
    var dateObj = new Date(newDate); 
 
    var day = ("0" + dateObj.getDate()).slice(-2); 
 
    var month = ("0" + (dateObj.getMonth() + 1)).slice(-2); 
 
    $('#edate').val(dateObj.getFullYear() + "-" + (month) + "-" + (day)); 
 
    } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<form> 
 
    Start Date: 
 
    <br/> 
 
    <input type="date" name="sdate" id="sdate" /> 
 
    <br/>End Date: 
 
    <br/> 
 
    <input type="date" name="edate" id="edate" readonly /> 
 
</form>

+0

使用選択が日付を起動したとき、彼は7日終了日を変更することが必要な場合があります。 –

+0

本当にありがとうございます。あなたは論理が正しいですが、結果は終了日に表示されますか? –

+0

@ローディング.. - 非常に可能... – Rayon

関連する問題