動的なdatetimepicker値を作成するには？このような

Question

私のHTMLコード：このような

$(function() {     
 
    $('#datetimepicker').datetimepicker({ 
 
     minDate: moment().startOf('minute').add(300, 'm'), 
 
    }); 
 
    
 
    $("#btnSubmit").click(function() { 
 
     value = document.getElementById('datetimepicker').value; 
 
     console.log(value) 
 
    }); 
 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/> 
 

 

 
<div class="container"> 
 
    <div class="row"> 
 
     <div class='col-sm-6'> 
 
      <div class="form-group"> 
 
       <input type='text' class="form-control" id='datetimepicker' /> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div> 
 
<button id="btnSubmit"> 
 
    Submit 
 
</button>

デモ：私は送信ボタンをクリックした場合、私は正常に300分

今からdatetime値を取得https://jsfiddle.net/oscar11/8jpmkcr5/83/

しかし、提出する前に、私は10分待って、結果は私の期待に一致しません

例えば6時に表示されます。提出する前に私は10分待つ。送信後、私が得る時間値は11.10です。だから私はそれが好きです

どうすればいいですか？ 自動日時の値を増やすにはどうすればよいですか？

更新：

テキストフィールドでの時間値が自動的に現在時刻に基づいて増加させることができるかどうか？

Answer 1

わからないが、なぜあなたがそれを必要とするだろうが、あなたのようなものを使用することができますクリックで

$("#btnSubmit").click(function() { 
    var targetDate = new Date(new Date().getTime() + (300 * 60 * 1000)); 
    $('#datetimepicker').data("DateTimePicker").date(targetDate); 

    value = document.getElementById('datetimepicker').value; 
    console.log(targetDate, value); 
}); 

を、それが現在の日付+ 300分のDateTimePickerを変更します。 私は例を更新しました：https://jsfiddle.net/8jpmkcr5/86/

EDIT：あなたの最新のコメントに をベースに、私はあなたが使用すると、日付（日/月/年）が、時間を選ぶことができるようにしたいと考えている（時/分）時間が現在の時間+ 3時間になるにつれて変化し続ける。場合thatsのあなたのようなものを使用することができた場合：

$(function() {     
    $('#datetimepicker').datetimepicker({ 
     minDate: moment().startOf('minute').add(180, 'm'), 
    }); 
}); 

setInterval(function(){ 
    var pickedDate = $('#datetimepicker').data('DateTimePicker').date(); 
    var currentDate = moment(); 
    pickedDate = pickedDate.set({ 
      'hour' : currentDate.get('hour') + 3, 
      'minute' : currentDate.get('minute'), 
      'second' : currentDate.get('second') 
     }); 
    $('#datetimepicker').data("DateTimePicker").date(pickedDate); 
},1000); 

をあなたはここにテストすることができます。https://jsfiddle.net/8jpmkcr5/98/

Answer 2

あなたはこのように提出するには別のアプローチを試してみて、300分を追加することができます。

$(function() {     
 
    $('#datetimepicker').datetimepicker({ 
 
     minDate: moment().startOf('minute').add(300, 'm'), 
 
    }); 
 
    
 
    $("#btnSubmit").click(function() { 
 
     value = document.getElementById('datetimepicker').value; 
 
     var d1 = new Date(), 
 
     d2 = new Date (value); 
 
     d2.setMinutes (d1.getMinutes() + 300); 
 
     console.log(moment(d2).format("YYYY-MM-DD HH:mm:ss")); 
 
    }); 
 
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
    <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 
 
    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.9.0/moment-with-locales.js"></script> 
 
    <script src="//cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/e8bddc60e73c1ec2475f827be36e1957af72e2ea/src/js/bootstrap-datetimepicker.js"></script> 
 
<div class="container"> 
 
    <div class="row"> 
 
     <div class='col-sm-6'> 
 
      <div class="form-group"> 
 
        <input type='text' class="form-control" id='datetimepicker' /> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div> 
 
<button id="btnSubmit"> 
 
Submit 
 
</button>

Answer 3

クリック数または分ごとに更新できます

function updateTime(){ 
$('#datetimepicker').data("DateTimePicker").date(moment().startOf('minute').add(180, 'm')); 
}; 

$(function() {     
    $('#datetimepicker').datetimepicker({ 
     minDate: moment().startOf('minute').add(180, 'm'), 
    }); 
}); 


$("#btnSubmit").click(function() { 
    updateTime(); 
    value = document.getElementById('datetimepicker').value; 
    console.log(value) 
    }); 

setInterval(function(){ 
    updateTime(); 
},60000); 

チェック https://jsfiddle.net/8jpmkcr5/88/

とにかくピッカーのアイデアは、ユーザが選択できるようにされ、それを使用して、いくつかの日付を強制するポイントは何ですか？