是否可以使用jQuery UI Datepicker格式化日期以显示小时,分钟和秒?
这是我目前的模型:
$(function() {
$('#datepicker').datepicker({ dateFormat: 'yyy-dd-mm HH:MM:ss' }).val();
});
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<title>snippet</title>
</head>
<body>
<input type="text" id="datepicker">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script>
当我致电.datepicker({ dateFormat: 'yyy-dd-mm HH:MM:ss' })
时,返回的值为:
201313-07-03 HH:7月:ss
这是JSFiddle。
答案 0 :(得分:37)
$("#datepicker").datepicker("option", "dateFormat", "yy-mm-dd ");
对于时间选择器,您应该将时间戳添加到Datepicker,并使用一个等效命令对其进行格式化。
修改强>
使用这个扩展jQuery UI Datepicker。你可以同时选择日期和时间。
答案 1 :(得分:37)
试试这个fiddle
$(function() {
$('#datepicker').datepicker({
dateFormat: 'yy-dd-mm',
onSelect: function(datetext) {
var d = new Date(); // for now
var h = d.getHours();
h = (h < 10) ? ("0" + h) : h ;
var m = d.getMinutes();
m = (m < 10) ? ("0" + m) : m ;
var s = d.getSeconds();
s = (s < 10) ? ("0" + s) : s ;
datetext = datetext + " " + h + ":" + m + ":" + s;
$('#datepicker').val(datetext);
}
});
});
答案 2 :(得分:29)
将jQuery UI与来自http://trentrichardson.com/examples/timepicker/
的优秀datetimepicker插件结合使用您可以指定 dateFormat 和 timeFormat
$('#datepicker').datetimepicker({
dateFormat: "yy-mm-dd",
timeFormat: "hh:mm:ss"
});
答案 3 :(得分:8)
或者,使用datetimepicker插件。
答案 4 :(得分:0)
如果您不想添加时间选择器,我们只能使用javascript作为时间部分。
var dateObj=new Date();
var date = $.datepicker.formatDate('dd M yy', dateObj);
var time = dateObj.getHours()+":"+dateObj.getMinutes()+":"+dateObj.getSeconds();
console.log(date," ",time);
答案 5 :(得分:0)
我添加了此代码
<input class="form-control input-small hasDatepicker" id="datepicker6" name="expire_date" type="text" value="2018-03-17 00:00:00">
<script src="/assets/js/datepicker/bootstrap-datepicker.js"></script>
<script>
$(document).ready(function() {
$("#datepicker6").datepicker({
isRTL: true,
dateFormat: "yy/mm/dd 23:59:59",
changeMonth: true,
changeYear: true
});
});
</script>
答案 6 :(得分:0)
format: 'YYYY-MM-DD HH:mm:ss',
答案 7 :(得分:0)
$(function() {
$('#datepicker').datepicker({ dateFormat: 'yy-d-m ' }).val();
});
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">
<title>snippet</title>
</head>
<body>
<input type="text" id="datepicker">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.min.js"></script>
答案 8 :(得分:0)
入门 从npm安装:
npm安装imask 并导入或要求:
从“ imask”导入IMask;
或使用CDN:
var dateMask = IMask(element, {
mask: Date, // enable date mask
// other options are optional
pattern: 'Y-`m-`d', // Pattern mask with defined blocks, default is 'd{.}`m{.}`Y'
// you can provide your own blocks definitions, default blocks for date mask are:
blocks: {
d: {
mask: IMask.MaskedRange,
from: 1,
to: 31,
maxLength: 2,
},
m: {
mask: IMask.MaskedRange,
from: 1,
to: 12,
maxLength: 2,
},
Y: {
mask: IMask.MaskedRange,
from: 1900,
to: 9999,
}
},
// define date -> str convertion
format: function (date) {
var day = date.getDate();
var month = date.getMonth() + 1;
var year = date.getFullYear();
if (day < 10) day = "0" + day;
if (month < 10) month = "0" + month;
return [year, month, day].join('-');
},
// define str -> date convertion
parse: function (str) {
var yearMonthDay = str.split('-');
return new Date(yearMonthDay[0], yearMonthDay[1] - 1, yearMonthDay[2]);
},
// optional interval options
min: new Date(2000, 0, 1), // defaults to `1900-01-01`
max: new Date(2020, 0, 1), // defaults to `9999-01-01`
autofix: true, // defaults to `false`
// also Pattern options can be set
lazy: false,
// and other common options
overwrite: true // defaults to `false`
});
答案 9 :(得分:0)
这对我来说很好:
$('#myelement').datetimepicker({
dateFormat: "yy-mm-dd",
timeFormat: "hh:mm:ss"
});