相关datetimepicker用法查看官网http://eonasdan.github.io/bootstrap-datetimepicker/

{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试datetimepicker插件</title>
    {#需要引入js、css文件#}
    <script src="{% static "components/jquery/dist/jquery.js" %}"></script>
    <script src="{% static "components/bootstrap/dist/js/bootstrap.js" %}"></script>
    <link rel="stylesheet" href="{% static "ace/css/bootstrap.css" %}"/>
    <script src="{% static "components/moment/moment.js" %}"></script>
    <link href="https://cdn.bootcss.com/smalot-bootstrap-datetimepicker/2.4.4/css/bootstrap-datetimepicker.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/smalot-bootstrap-datetimepicker/2.4.4/js/bootstrap-datetimepicker.js"></script>
    {#重要，弹出日历里面显示的文字bootstrap里面显示的是英文 ，触发后显示的年月日等的显示文字，即为：Jan，feb等#}
    <script src="https://cdn.bootcss.com/smalot-bootstrap-datetimepicker/2.4.4/js/locales/bootstrap-datetimepicker.fr.js"></script>
    {#中文显示#}
    <script src="https://cdn.bootcss.com/smalot-bootstrap-datetimepicker/2.4.4/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
</head>
<body>
<input type="text" id="start_time" name="start_time">
<input type="text" id="end_time" name="end_time">
</body>
</html>
<script>
    $('#start_time').datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        todayBtn:true,
        clearBtn:true,
    });
    $('#end_time').datetimepicker({
        format: 'yyyy-mm-dd hh:ii:ss',
        todayBtn:true,
    });
</script>

时间插件datetimepicker的更多相关文章

  1. angularjs封装bootstrap官网的时间插件datetimepicker

    背景:angular与jquery类库的协作 第三方类库中,不得不提的是大名鼎鼎的jquery,现在基本上已经是国内web开发的必修工具了.它灵活的dom操作,让很多web开发人员欲罢不能.再加上已经 ...

  2. Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定

    一放假就高产似母猪了. 00.混乱的前端界 Angular1.x确实是个学习成本很高的框架,刚开始实习那会儿,前端啥也不懂,工头说用Angular,我们这群小弟也只能硬着头皮学.在这之前,前端的东西大 ...

  3. boostrap日期时间插件datetimepicker使用过程的一些问题总结

    1.汉化问题 虽然有转门的汉化脚本,不过如果简单使用的话自己稍微改一下源码就行了: var dates = $.fn.datetimepicker.dates = { en: { days: ['Su ...

  4. bootstrap日期时间插件datetimepicker

    <!DOCTYPE HTML> 02 <html> 03   <head> 04     <link href="http://netdna.boo ...

  5. 项目中遇到angular时间插件datetinepicker汉化问题

    问题描述: 测试需要中文的时间插件: 参考资料: angularjs封装bootstrap官网的时间插件datetimepicker https://www.cnblogs.com/cynthia-w ...

  6. 1、用datetimepicker插件实现限定时间范围的选择 2、时间插件实现默认当天的时间和只能选择小于今天的日期

    一.用datetimepicker插件实现限定时间范围的选择 1.下面是要实现的效果图,让开始时间只能从  2018-7-1  到 2018-7-7 选择. 2.html的结构 <div cla ...

  7. 【bootstrap】时间选择器datetimepicker和daterangepicker

    在bootstrap中的时间选择器有两种:dateTimePicker和dateRangePicker 1.dateTimePicker好像是官方嫡插件:   需要的文件: <link rel= ...

  8. bootstrap-datetimepicker bootstrap-datepicker bootstrap-timepicker 时间插件

    <!DOCTYPE html><head> <title>时间插件测试</title><style type="text/css&quo ...

  9. 【Bootstrap】bootstrap-datetimepicker日期时间插件

    [bootstrap-datetimepicker] datetimepicker是一个比较方便的日期时间插件.有了这个之后,我们可以在类似于表单的地方提供一个友好的日期(时间)输入功能.官方文档:[ ...

随机推荐

  1. 大规模实时流处理平台架构-zz

    随着不同网络质量下接入终端设备种类的增多,服务端转码已经成为视频点播和直播产品中必备的能力之一.直播产品讲究时效性,希望在一定的时间内让所有终端看到不同尺寸甚至是不同质量的视频,因此对转码的实时性要求 ...

  2. python面向对象——类

    from:http://www.runoob.com/python3/python3-class.html Python3 面向对象 Python从设计之初就已经是一门面向对象的语言,正因为如此,在P ...

  3. aarch64_j2

    js-yui2-2.9.0-10.fc24.noarch.rpm 2016-09-25 07:06 1.2M fedora Mirroring Project js-yui2-jenkins-2.9. ...

  4. 使用postman做接口测试（一）

    参考大神的总结:https://www.cnblogs.com/Skyyj/p/6856728.html 一,先了解一下基础知识,虽然工作中没什么卵用,但背会了,可以显摆自己很专业的样子,以下内容来自 ...

  5. 玩玩 Nginx 1----- Nginx + ngx_lua安装测试【CentOs下】

          最近打算搞搞nginx,扒着各位先驱的文章自己进行测试下,中间过程也是错误不断,记录一下,以备使用.       nginx的安装挺简单的,主要还是研究下一些第三方的模块,首先想试下初始化 ...

  6. Python开发环境（1）：Eclipse+PyDev插件

    电脑:小米笔记本电脑Pro 15.6寸(i5-8250U),操作系统:Windows 10,JDK版本:1.8.0_152(环境变量已配置) Step 1.下载Eclipse 根据我的CPU型号,选择 ...

  7. C++链接与装载

    1..obj文件的内部结构 2.映射到进程虚拟空间 3.链接的原理    C++ Code  123456789   1.未解决符号表:提供了所有在该编译单元里引用但是定义并不在本编译单元里的符号及其 ...

  8. sql server 2000系统表sysproperties在SQL 2008中无效的问题

    Sqlserver有一个扩展属性系统表sysproperties,因为只接触过MSSQL2005及以后的版本,在生产库2008版本及联机文档上搜了下都找不到这个系统表,后来发现这个系统表在2005版本 ...

  9. SQL Server日期计算

    通常,你需要获得当前日期和计算一些其他的日期,例如,你的程序可能需要判断一个月的第一天或者最后一天.你们大部分人大概都知道怎样把日期进行分割(年.月.日等),然后仅仅用分割出来的年.月.日等放在几个函 ...

  10. Elastic-Job开发指南

    开发指南 代码开发 作业类型 目前提供3种作业类型,分别是Simple,DataFlow和Script. DataFlow类型用于处理数据流,它又提供2种作业类型,分别是ThroughputDataF ...