需要时间戳以24小时格式添加内联

时间:2018-01-31 16:46:08

标签: javascript html timepicker

我是javascript的新手,需要24小时格式的时间选择器..虽然有几个时间戳可在线获得,但大多数都是12小时格式的复杂代码和外部文件。有很多jquery和javascript代码可用于datepicker,但没有一个可用于timepicker。

我正在使用这个时间戳,但它不起作用.. datepicker工作正常..可以做出哪些更改?

<head>
    <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#datepicker" ).datepicker({ minDate: 0, maxDate: "+1M +10D" });
  } );
  </script>

  <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.0.js"></script>
  <script type="text/javascript" src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <script type="text/javascript" src="jquery-ui-timepicker-addon.js"></script>
  <script type="text/javascript">
  $(function(){
  $("#timepicker1").timepicker();
  });
  </script>

<link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="inputvalidation.js"></script>


    </head>

3 个答案:

答案 0 :(得分:0)

您是否尝试过使用bootstrap-datetimepicker

使用 bootstrap-datetimepicker ,如果您需要24小时格式,我相信您必须像这样编辑Moment.js

moment().format("dddd, MMMM Do YYYY, HH:mm:ss");
  

格式还指示显示哪些组件,例如MM / dd / YYYY不会显示时间选择器。

Here是此工具格式的完整文档。

<强>更新

我知道您因为此工具中使用的各种库而感到困惑。这个问题之前已在here中提出过。您可以将库从那里复制并粘贴到您的页面,因为它们都是指向现有服务器的外部链接。

答案 1 :(得分:0)

在HTML 5中,建议允许:

<Input type="time">

在这种情况下,24小时取决于客户端,但这个解决方案很简单。

或者,如果有更好的响应属性,下拉列表可能代表0-24小时,另一个下拉代表0-60分钟。

答案 2 :(得分:0)

在HTML 5中,建议允许:

<input type="time">

时间输入格式取决于客户端的浏览器。

替代方案可以使用输入类型='数字'输入,最小0 - 24小时,最小0 - 60分钟。

另一种替代方案可以通过选择下拉数小时和分钟来解决更好的响应属性。