先上效果：

代码：

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /title日期选择/titlelink rel='样式表href=' reset-jquery-ui。量滴CSS '/脚本类型=' text/JavaScript ' src=' http : jquery-1。8 .3 .量滴js '/script脚本类型=' text/JavaScript ' src=' http : jquery-ui。js/script脚本类型=' text/JavaScript '/日期选择$ .日期选择器。区域[' zh-CN ']={ cleartext : '清除，clearStatus: '清除已选日期，壁橱： '关闭，closeStatus: '不改变当前选择，prevText: '上月，prevStatus: '显示上月，prevBigText: ' '，prevBigStatus: '显示上一年，下一个文本： '下月，nextStatus: '显示下月，下一个大文本： ' ',下一个大状态3360 '显示下一年，currentText: '今天，currentStatus: '显示本月，monthNames: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月]，monthNamesShort: ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二]，monthStatus: '选择月份，yearStatus: '选择年份，weekHeader: '周，weekStatus: '年内周次，日名： ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五， '星期六]，daynameshort :['周日', '周一', '周二', '周三', '周四', '周五', '周六]，dayNamesMin: ['日', '一', '二', '三', '四', '五', '六],日状态： '设置直接伤害为一周起始，日期状态： '选择m月d日，日，日期格式： '年月日'，第一天： 1,初始状态： '请选择日期，isrtl : false }；$ .日期选择器。setdefaults($。日期选择器。区域[' zh-CN '])；var a=0；var tmpdate=/** *实例化日期控件，并绑定回调函数，传入相应参数* tagId日期控件实例化的标签id * ajaxMethod回调函数* ajaxMethod函数需要用到的额外参数* */函数DatePickerbyid(TagID){ $(TagID).日期选择器({ isDataChecked:true，autoClose:true，showOtherMonths: true，changeYear: true，//showstatus 3360 true，//show : '两者，月数33602,//显示几个月showMonthAfterYear:true，onSelect:函数(dateText，inst) {//选择日期后执行的操作a；inst . auto close=true if(a==1){ inst。设置。isdata checked=falsetmpdate=DateText } if(a==2){ a=0；本月的设置。isdata checked=falseinst.autoClose=falsevar date1=新日期getTime()；var日期2=新日期（日期文本)。getTime()；var arg={ time _ s:date1，time _ e : date 2 }；//ajax函数要用到的时间参数if(date1date2){ $(tagId).val(tmp日期。替换(///ig，'-')'至datetext。替换(//-ig，'-')；} else if(date 1==date 2){ a=1；本月的设置。isdata checked=falseinst . autoclose=true } else { $(TagID).val(日期文本。替换(///ig，'-')'至tmpdate。替换(///ig，'-')；} } } });}/脚本/床头时间选择：输入id=' div 1 ' style=' height :30 px；宽度width :190 px '/脚本类型=' text/JavaScript ' DatePickerbyid '(# div 1 ')；/脚本/正文/html基于jquery UI 1.11.4修改如下（在源码里面修改):

/*隐藏视图中的日期选择器* @param输入元素-附加到日期选取器的输入字段*/_hideDatepicker:函数（输入){ var showAnim，duration，后置处理，onClose，inst=this ._ curInstif(！inst ||(输入inst！==$.数据（输入、“日期选择器”)){ return} /** * 2015.6.11 修改*作者：链接*增加inst.autoClose控制日历面板*////-if(this ._ datepickerShowing | |！inst.autoClose) { showAnim=this ._get(inst，‘show anim’)；持续时间=这个_get(inst，“持续时间”)；post process=function(){ $。日期选择器。_ tidyDialog(inst)；};1.8.x $的公元前后不赞成：如果(inst.autoClose===true){ //这里不隐藏}else{ if ($).效果($.effects.effect[ showAnim ] || $ .效果[显示动画]){ inst。dpdiv。隐藏(显示动画，$.datepicker._get(inst，' showOptions ')，持续时间，后期处理);} else { inst。dpdiv[(显示动画==='向下滑动'？向上滑动' :(显示动画===' fadeIn '？淡出' : '隐藏'))]((显示动漫？持续时间：(空),后处理);} }///-if(！show anim){ 0后置处理();}这个_ DatePickershaving=FastOnClose=这个_ _ get(inst，' OnClose ')；if(onClose){ onClose。应用(((inst。输入？inst.input[0] : null)，[(inst.input？本月的输入。val()(: ' ')、inst])；}这个_ lastInput=null如果（这个_ IndiLog){ 0这_ dialoginput。CSS({ position : ' absolute '，left: '0 '，top : '-100px ' })；if ($ .blockUI) { $ .unblockUI()；$(“正文”).追加(这个。dpdiv)；} }这个_ inDialog=false} }，

以上所述就是本文的全部内容了，希望大家能够喜欢。