bootstrap日期时间插件datetimepicker

<!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
posted @ 2013-12-26 14:41  yttsic  阅读(1012)  评论(0)    收藏  举报