php 基于bootstrap 的 datatimepicker 

 1 <!DOCTYPE HTML>  
 2 <html>  
 3   <head>  
 4     <link href="assets/css/bootstrap.css" rel="stylesheet">  
 5     <link rel="stylesheet" type="text/css" media="screen"  href="assets/css/bootstrap-datetimepicker.min.css">  
 6         <script type="text/javascript"  src="assets/js/jquery.js"></script>   
 7     <script type="text/javascript"  src="assets/js/bootstrap.js"></script>  
 8     <script type="text/javascript"  src="assets/js/bootstrap-datetimepicker.min.js"></script>  
 9   </head>  
10   <body>  
11     <div id="datetimepicker" class="input-append date">  
12       <input type="text" name="time" id="time"></input>  
13       <span class="add-on">  
14         <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>  
15       </span>  
16     </div>  
17     <div id="datetimepicker" class="input-append date ">  
18       <input type="text" name="time" id="time"></input>  
19       <span class="add-on">  
20         <i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>  
21       </span>  
22     </div> 
23     <script type="text/javascript">  
24       $('.datetimepicker').datetimepicker({  
25         format: 'MM/dd/yyyy',  
26         language: 'en',  
27         pickDate: true,  
28         pickTime: true,  
29         
30         
31          
32         inputMask: true  
33       });  
34     </script>  
35   </body>  
36 <html>

需要用到以下文件:

bootstrap-combined.min.css

bootstrap-datetimepicker.min.css

jquery.min.js

bootstrap.min.js

bootstrap-datetimepicker.min.js

glyphicons-halflings.png

 

posted @ 2014-05-20 19:39  NintendoBoy  阅读(212)  评论(0)    收藏  举报