日历(datepicker)的使用组件可以让用户方便、直观地输入日期，充分考虑了不同国家的语言限制。
<!DOCTYPE>
<html>
<head>
<title>日历</title>
<meta charset="utf-8"/>
<script src="../jquery-ui/jquery-1.9.1.js"></script>
<script src="../jquery-ui/ui/jquery-ui.js"></script>
<script src="../jquery-ui/ui/i18n/jquery.ui.datepicker-zh-CN.js"></script>
<link rel="stylesheet" href="../jquery-ui/themes/base/jquery-ui.css" target="_blank" rel="external nofollow" >
</head>
<body>
<h3>Click to select a date</h3>
<input id="date" />
<script>
$("#date").datepicker({
firstDay:1,//整数,指定日历中的星期从星期几开始,0表示星期日
numberOfMonths:1,//日历中显示月份的个数,如果是[3,2]则显示六个月份,两行三列
showOtherMonths:true,//显示不满的上个月和下个月天
selectOtherMonths:true,//上面显示的OtherMonths可以选择
changeMonth:false,//提供月份的下拉列表
changeYear:true,//提供年份的下拉列表
showAnim:"slide",//显示或消失时产生的视觉特效
//特效:fadeIn,blind,bounce,clip,drop,fold,highlight,puff,pulsate,scale,slide
duration:1000,//日历显示或消失特效持续的事件
//以下是国际化选项
dateFormat:"yy-mm-dd",//返回日期格式,默认mm/dd/yy
//日期格式 d(1-31),dd(01-31),o(1-366),oo(001-366),D(Mon,Tue..)
//DD(Monday,Tuesday..),m(1-12),mm(01-12),M(Jan,Feb..),MM(January,February..)
//y(12表示2012),yy(2012),@(毫秒数)
//dayNames:["Sunday","Monday"],//以数组的形式指定星期天的长格式名称
//dayNamesShort:,//短格式
//datNamesMin:,//以数组形式指定星期中天的最小格式名称
//monthNames:,//以数组形式指定月份长格式名称
//monthNamesShort:,
//管理日期选择
//minDate:,//日历中可以选择的最小日期
//maxDate:,//日历中可以选择的最大日期
//defaultDate:,//预先设置默认日期
/*
//管理日历事件
beforeShow://显示之前调用
beforeShowDay:,//显示日期中每个日期会被调用
onChangeMonthYear:,//月份或年份改变时被调用
onClose:,//关闭日历时会被调用
onSelect:,//选择了日期是会被调用
*/
/*
datepicker("show")/datepicker("hide")/
datepicker("getDate")//返回选择的日期的Date对象
datepicker("setDate",date)//初始化日历预设日期
datepicker("option",param)//
datepicker("destroy")//移除日历管理
*/
//选择日期字符串表示形式
//X(-X)当前日期之后(前)的X(1~n)天
//Xm(-Xm)当前日期之后(前)的X个月(其中X范围从1到n)
//Xw(-Xw)当前日期之后(前)的X周
minDate:-3,
maxDate:"1w",
defaultDate:"1w+1"
});
</script>
</body></html> 
![用js实现的一个加载中状态的动态效果[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)