<!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. C++Primer第5版学习笔记（三）

    C++Primer第5版学习笔记(三) 第四/五章的重难点内容           你可以点击这里回顾第三章内容       因为第五章的内容比较少,因此和第四章的笔记内容合并.       第四章是 ...

  2. codeforces 400D Dima and Bacteria 并查集+floyd

    题目链接:http://codeforces.com/problemset/problem/400/D 题目大意: 给定n个集合,m步操作,k个种类的细菌, 第二行给出k个数表示连续的xi个数属于i集 ...

  3. Install Asterisk 11 on Ubuntu 12.04 LTS

    http://blogs.digium.com/2012/11/14/how-to-install-asterisk-11-on-ubuntu-12-4-lts/ Last week I put up ...

  4. Linux2.6内核--中断线被关闭的情况

          中断系统是现代操作系统中不可获取的一个子系统,它由硬件主动触发并发送到CPU,最后由内核调用中断处理程序处理中断.       那么中断有时候需要关闭,这是为什么呢?       一般分为 ...

  5. memcache基本讲解

    Memcached技术 介绍: memcached是一种缓存技术, 他可以把你的数据放入内存,从而通过内存访问提速,因为内存最快的, memcached技术的主要目的提速, 在memachec 中维护 ...

  6. 【转】HTML5的语音输入 渐进使用HTML5语言识别, so easy!

    转自: 本文地址:http://www.zhangxinxu.com/wordpress/?p=2408 一.本不想写此文 HTML5语音识别(现在一般用在搜索上),目前相关介绍还是挺多的.为何呢?因 ...

  7. hdoj 3157 Crazy Circuits 【有下界最小流】

    题目:hdoj 3157 Crazy Circuits 题意:如今要制造一个电路板.电路板上有 n 个电子元件,各个元件之间有单向的电流流向.然后有一个 + .电流进入, -- 电流汇入,然后推断能不 ...

  8. [RxJS] map vs flatMap

    What's the difference between map and flatmap? First, let's show what map is. To show that, I need a ...

  9. android 08 AndroidManifest.xml

    AndroidManifest.xml <?xml version="1.0" encoding="utf-8"?> <manifest xm ...

  10. 再回首，Java温故知新（九）：Java基础之流程控制语句

    流程控制语句分为条件语句.循环语句和中断语句. 中断语句包括break和continue,两者的区别在于break会跳出整个循环,而continue则是跳出此次循环,之后还会继续下一次循环. 条件语句 ...