Datetimepicker (EONASDAN) 发送选择作为最接近分钟四舍五入的纪元时间戳

Datetimepicker (EONASDAN) sends selection as epoch timestamp nearest minute rounded

我想使用 Eonasdan 日期时间选择器库。 (诉4.17.47)

我需要在 bootstrap 模板中包含一个允许用户选择日期和时间的简单表单(GET 方法)。

时间选择必须有 1 分钟的粒度。

单击提交按钮后,我希望将用户选择作为纪元格式发送出去。

在我下面的示例中,确实发送了纪元格式,但时间戳中添加了额外的秒数,我想避免这种情况,这一定是由于 onchange 函数造成的。

我怎样才能得到 epoch 时间戳值作为用户选择的真实镜像在最近的分钟四舍五入?

http://jsfiddle.net/lcoulon/ze2x8358/

$('#datetimepicker1').datetimepicker({
  locale: 'fr',
});

// Sends epoch (unix time) into epoch-start-time form
$('#datetimepicker1').on(`dp.change`, X => $('#epoch-start-time').val(X.date.unix()));

您可以使用 momentjs startOf 传递 'minute' 作为 粒度 参数

moment().startOf('minute');  // set to now, but with 0 seconds and 0 milliseconds

这是一个工作示例:

$('#datetimepicker1').datetimepicker({
  locale: 'fr'
});
          
// Sends epoch (unix time) into epoch-start-time form
$('#datetimepicker1').on(`dp.change`, X =>
$('#epoch-start-time').val(X.date.startOf('minute').unix()));
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>

<div class="container" style="margin:50px;">
  <h4>EOSNASDAN Bootstrap Datetime Picker</h4>
  <div class="row">
    <div class='col-sm-6'>
      <form class="form-horizontal" method="GET"> 
        <div class="form-group">
          <div class="input-group date col-md-5" data-date="2017-01-01T12:00:00Z" data-date-format="yyyy-mm-dd hh" data-link-field="epoch-start-time" id="datetimepicker1">  
            <input type='text' class="form-control" />
            <span class="input-group-addon">
              <span class="glyphicon glyphicon-calendar"></span>
            </span>
          </div>
          <input id="epoch-start-time" name="epoch" type="hidden"/>
        </div>
        <div class="form-group">
          <div class="col-sm-10 col-sm-offset-2">
            <button class="btn btn-info btn-sm" type="submit">Submit</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>