Question

我正在使用来自http://weareoutman.github.io/clockpicker/的clockpicker，我正试图找出如何在文本框中显示时间（总是）。我希望时间永远显示为＆＃34;现在＆＃34;在文本框中，但让用户能够使用时钟窗口更改它。我已经能够设置现在的＆＃39;时间默认为时钟，但我有两个问题。

第一个问题 如果仅使用＆＃39;现在＆＃39;

，时钟不会显示其AM或PM

第二个问题除非从时钟中选择，否则我无法在文本框的值中显示该时间。我希望现在已经有时间了。但允许用户选择使用时钟更改它。 Format ex: 08:30 PM

非常感谢任何帮助！

http://jsfiddle.net/YkvK9/1714/

<div class="col-lg-6">
  <div class="form-group">
    <label>test</label>
    <div class="input-group clockpicker" data-autoclose="true">
      <input type="text" class="form-control" value="">
      <span class="input-group-addon">
        <span class="fa fa-clock-o"></span>
      </span>
    </div>
  </div>
</div>

$('.clockpicker').clockpicker({
   'default': 'now',
   twelvehour: true,
});

Answer 1

clockpicker中没有这样的选项来设置输入值当前时间。

但是你可以在timepicker之后手动设置当前时间的输入时间。试试下面的approch。

＆＃13;

$('.clockpicker').clockpicker({
  'default': DisplayCurrentTime(),
  twelvehour: true,
}).find('input').val(DisplayCurrentTime())

function DisplayCurrentTime() {
  var date = new Date();
  var hours = date.getHours() > 12 ? date.getHours() - 12 : date.getHours();
  var am_pm = date.getHours() >= 12 ? "PM" : "AM";
  hours = hours < 10 ? "0" + hours : hours;
  var minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
  var seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
  time = hours + ":" + minutes + ":" + am_pm;
  //time = hours + ":" + minutes + am_pm;
  return time;
};

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/js/bootstrap.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha/css/bootstrap.css" rel="stylesheet" />
<link href="http://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.css" rel="stylesheet" />
<script src="http://weareoutman.github.io/clockpicker/dist/jquery-clockpicker.min.js"></script>
<div class="col-lg-6">
  <div class="form-group">
    <label>test</label>
    <div class="input-group clockpicker" data-autoclose="true">
      <input type="text" class="form-control" value="">
      <span class="input-group-addon">
          <span class="fa fa-clock-o"></span>
      </span>
    </div>
  </div>
</div>

＆＃13;

Answer 2

此处SlotFrom是文本框的ID。我使用以下代码，但它不会在控制器端读取值。请提供正确的解决方案。

我在js中写了以下内容

<script>
var Dt = new Date();
$('#SlotFrom').clockpicker({autoclose: true,twelvehour: true}).val(moment(Dt.getTime()).format("HH:mm A"));

在与clockpicker相对应的文本框中设置时间

2 个答案: