JQuery datepicker 用法 jQuery UI很强大，其中的日期选择

最新推荐文章于 2025-08-01 09:39:22 发布

原创最新推荐文章于 2025-08-01 09:39:22 发布 · 688 阅读

0 ·

CC 4.0 BY-SA版权

经验及相关软件的使用同时被 2 个专栏收录

65 篇文章

订阅专栏

Jquery和Js和Css

28 篇文章

订阅专栏

本文介绍了jQuery UI中强大的Datepicker插件的基本用法及配置选项。通过自定义展示方式，如日期格式、语言设置、限制日期范围等，实现丰富的日期选择功能。

jQuery UI很强大，其中的日期选择插件Datepicker是一个配置灵活的插件，我们可以自定义其展示方式，包括日期格式、语言、限制选择日期范围、添加相关按钮以及其它导航等。
官方地址：http://docs.jquery.com/UI/Datepicker，官方示例： http://jqueryui.com/demos/datepicker/。

一个不错的地址，用来DIY jQuery UI界面效果的站点http://jqueryui.com/themeroller/

DatePicker基本使用方法：

<! DOCTYPE html >
< html >
< head >
   < link href ="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel ="stylesheet" type ="text/css" />
   < script src ="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" ></ script >
   < script src ="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" ></ script >

   < script >
  $(document).ready( function () {
    $( " #datepicker " ).datepicker();
  });
   </ script >
</ head >
< body style ="font-size:62.5%;" >

< div type ="text" id ="datepicker" ></ div >

</ body >
</ html >