jQuery Datepicker 日期插件

Datepicker日期选择插件是一个配置灵活的插件,可以自定义其展示方式,包括日期格式、语言、限制选择日期范围、添加相关按钮以及其它导航等。

 

1、jQuery Datepicker

示例代码:

[html][/html] view plaincopyprint?

  1. <!doctype html>
  2. <html lang=”en”>
  3. <head>
  4.   <meta charset=”utf-8″ />
  5.   <title>jQuery UI Datepicker – Default functionality</title>
  6.   <link rel=”stylesheet” href=”http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css” />
  7.   <script src=”http://code.jquery.com/jquery-1.9.1.js”></script>
  8.   <script src=”http://code.jquery.com/ui/1.10.3/jquery-ui.js”></script>
  9.   <link rel=”stylesheet” href=”/resources/demos/style.css” />
  10.   <script>
  11.     $(function() {
  12.         $( “#datepicker” ).datepicker();
  13.     });
  14.   </script>
  15. </head>
  16. <body>
  17.     <p>Date: <input type=”text” id=”datepicker” /></p>
  18. </body>
  19. </html>

 

运行结果:

 

2、my97 Datepicker

示例代码:

[html][/html] view plaincopyprint?

  1. <html>
  2. <head>
  3. <link type=”text/css” href=”css/ui-lightness/jquery-ui-1.8.16.custom.css” rel=”stylesheet” />
  4.     <script type=”text/javascript” src=”WdatePicker.js”></script>
  5. </head>
  6. <body>
  7. <input id=”d424″ class=”Wdate” type=”text” onfocus=”WdatePicker({dateFmt:’yyyy-MM-dd HH:mm:ss’})”/>
  8. </body>
  9. </html>

运行代码:


源码下载

标签