<!DOCTYPE HTML>
02 <html>
03   <head>
04     <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
05     <link rel="stylesheet" type="text/css" media="screen"
06      href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
07   </head>
08   <body>
09     <div id="datetimepicker" class="input-append date">
10       <input type="text"></input>
11       <span class="add-on">
12         <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
13       </span>
14     </div>
15     <script type="text/javascript"
16      src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js">
17     </script>
18     <script type="text/javascript"
19      src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
20     </script>
21     <script type="text/javascript"
22      src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
23     </script>
24     <script type="text/javascript">
25       $('#datetimepicker').datetimepicker({
26         format: 'MM/dd/yyyy hh:mm',
27         language: 'en',
28         pickDate: true,
29         pickTime: true,
30         hourStep: 1,
31         minuteStep: 15,
32         secondStep: 30,
33         inputMask: true
34       });
35     </script>
36   </body>
37

<html>

格式如下：

<input id="to_datetime" type="text" class="zc_input" value="结束日期" data-date-format="yyyy-mm-dd hh:ii" data-date="<?php echo date('Y-m-d',time())?>T05:25:07Z">

<script>

$('#from_datetime').datetimepicker({
        language:  'zh-CN',
        format: 'yyyy-mm-dd hh:ii',
        weekStart: 1,
        todayBtn:  1,
  autoclose: 1,
  todayHighlight: 1,
  startView: 2,
  forceParse: 0,
        showMeridian: 1,
  initialDate:2013-12-23
        //pickerPosition: "bottom-left"
    });

</script>

　　　　　　　　　　　　　　by:yttsic

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

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

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

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

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

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

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

  4. Bootstrap日期/日历插件Datepicker 时间加标记

    由于工作需要,项目中使用了Bootstrap日期/日历插件Datepicker,根据需求需要在其中添加日期标记,实现效果图如下: 特此记录此次解决方案: 1.首先分析了功能的DOM元素(如下图),可以 ...

  5. vue使用日期时间插件layDate

    项目中需要用到日期时间插件,尝试用bootstrap.element的时间插件都各有各的报错,对于一个菜鸟来说真的是很痛苦啊.终于,最后用了layDate实现了需要的功能 最终效果: 使用步骤: 1. ...

  6. 原生js日期时间插件鼠标点击文本框弹出日期时间表格选择日期时间

    原文出处 (这是我从互联网上搜来的,感觉能满足各方面的需求.个人感觉挺不错的,所以后期修改了一下向大家推荐!) 效果图: html代码: <!DOCTYPE html PUBLIC " ...

  7. dateTimePicker日期时间插件-----限定节假日调休的可选择性

    需求:在项目中需要一款这样的日期插件,可以选择年月日,时分秒,对法定节假日不能选择,因法定节假日进行的调休可以选择: 现在使用的比较多的日期插件比如:Wdatepicker,jqueryUI的date ...

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

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

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

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

随机推荐

  1. 转 MySQL 用户权限详细汇总

    http://blog.csdn.net/mchdba/article/details/45934981 1,MySQL权限体系 MySQL 的权限体系大致分为5个层级: 全局层级: 全局权限适用于一 ...

  2. UVa11526 H(n)

    http://blog.csdn.net/synapse7/article/details/12873437 #include<cstdio> #include<cstring> ...

  3. LeetCode——Linked List Cycle

    Given a linked list, determine if it has a cycle in it. Follow up: Can you solve it without using ex ...

  4. [RxJS] Combination operator: zip

    CombineLatest and withLatestFrom are both AND-style combination operators. In this lesson, we will l ...

  5. Understanding JTS--reference

    Part I-An introduction to transactions If you look at any introductory article or book on J2EE, you' ...

  6. [转] Express 4 中的变化

    http://www.cnblogs.com/haogj/p/3985438.html 概览 从 Express 3 到Express 4 是一个巨大的变化,这意味着现存的 Express 3 应用在 ...

  7. 使用SqlAlchemy时如何方便的取得dict数据、dumps成Json

    使用Sqlalchemy可以方便的从数据库读取出python对象形式的数据(吐槽:说实话对象形式也没多方便,还不如我之前从关系型数据库直接读取出dict形式的数据用起来方便,具体参见我以前的文章htt ...

  8. Objective-C：KVC

    1 概述 1.1 访问方法 Key-value coding(KVC)是一种间接访问对象属性的机制,类似键值对,通过名字(或键)可以直接获得对象的属性值.事实上,key-value coding定义了 ...

  9. abc - zx

    诛仙青云志 第26集    第25集 第24集    第23集    第22集   第21集    第20集    第19集  第18集    第17集    第16集   第15集     第14集 ...

  10. dedecms 5.7文章编辑器附件上传图标不显示

    我最近发现在使用dedecms 5.7文章编辑器附件上传图标不显示了,以前是没有问题的,这个更新系统就出来问题了,下面我来给大家分享此问题解决办法.   问题bug:在dedecms 5.7中发现了一 ...