JQuery UI 日历控件属性设置

最新推荐文章于 2022-11-06 08:33:01 发布

arvte20486

最新推荐文章于 2022-11-06 08:33:01 发布

阅读量155

点赞数 1

文章标签： javascript ui ViewUI

原文链接：http://www.cnblogs.com/XLHM-ZCH/p/3277141.html

版权

$(function (){
$("#datepicker").datepicker({
dateFormat:'yy-mm-dd', //更改时间显示模式
showAnim:"slide", //显示日历的效果slide、fadeIn、show等
changeMonth:true, //是否显示月份的下拉菜单，默认为false
changeYear:true, //是否显示年份的下拉菜单，默认为false
showWeek:true, //是否显示星期,默认为false
showButtonPanel:true, //是否显示取消按钮，并含有today按钮，默认为false
closeText:'close', //设置关闭按钮的值
yearRange:'2010:2012', //显示可供选择的年份
defaultDate:+7 //表示默认日期是在当前日期加上7天
});
//---------------------利用datepicker创建时间段----------------
$("#dateStart").datepicker({ //绑定开始日期
changeMonth:true, //显示下拉列表月份
changeYear:true, //显示下拉列表年份
showWeek:true, //显示星期
firstDay:"1", //设置开始为1号
onSelect:function(dateText,inst){
//设置结束日期的最小日期
$("dateEnd").datepicker('option','minDate',new Date(dateText.replace('-',',')));
}
});
$("#dateEnd").datepicker({ //设置结束绑定日期
changeMonth:true, //显示下拉列表月份
changeYear:true, //显示下拉列表年份
showWeek:true, //显示星期
firstDay:"1", //设置开始为1号
onSelect:function(dateText,inst){
//设置开始日期的最大日期
$('#dateStart').datepicker('option','maxDate',new Date(dateText.replace('-',',')));
}
});
});