datetimepicker.js

datetimepicker：时间选择器

<link rel="stylesheet" href="{% static 'bootstrap-datetimepicker.min.css' %}">

'''
<input type="text" name="preview_time" class=" form-control" required="" id="id_preview_time">
<input type="text" name="start_time" class=" form-control" required="" id="id_start_time">
<input type="text" name="end_time" class=" form-control" required="" id="id_end_time">
'''

<script src="{% static 'bootstrap-datetimepicker.min.js' %}"></script>
<script src="{% static 'bootstrap-datetimepicker.zh-CN.js'

1. 年月日

{% block js %}
	%}"></script>
	<script>
		$('[name=start_time]').datetimepicker({
			language: 'zh',
			format: 'yyyy-mm-dd ', //时间显示格式 年-月-日
			autoclose: true, //选择完时间后自动关闭，默认false（不关闭）,
			startView: 2,
			minView: 2,
			todayBtn: true,
			todayHighlight: 1,
			pickerPosition: 'bottom-left',
			forceParse: 0
		}).on('changeDate', function (ev) {
			var startTime = $('[name=start_time]').val();

			$('[name=start_time]').datetimepicker('hide');

			$('[name=end_time]').datetimepicker('setStartDate', startTime);
		});
		$('[name=end_time]').datetimepicker({
			language: 'zh',
			format: 'yyyy-mm-dd ', //时间显示格式 年-月-日 时：分
			autoclose: true, //选择完时间后自动关闭，默认false（不关闭）
			startView: 2,
			minView: 2,
			todayBtn: true,
			todayHighlight: 1,
			pickerPosition: 'bottom-left',
			forceParse: 0
		}).on('changeDate', function (ev) {
			//var startTime = $('#startDate').val();
			var endTime = $('[name=end_time]').val();
			$('[name=start_time]').datetimepicker('setEndDate', endTime);
			$('[name=end_time]').datetimepicker('hide');
		})
	</script>
{% endblock %}

2. 年月日时分秒

{% block js %}

<script>
    Date.prototype.Format = function (fmt) { //author: meizz
        var o = {
            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "h+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    };

    $(function () {
        initDatepicker();
    });

    function initDatepicker() {
        $('#id_start_time,#id_preview_time,#id_end_time').datetimepicker({
            language: "zh-CN",
            minView: "hour", // month
            sideBySide: true,
            format: 'yyyy-mm-dd hh:ii',
            bootcssVer: 3,
            startDate: new Date(),
            autoclose: true
        })
    }
</script>

{% endblock %}