jquery datepicker-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

jquery datepicker

简介: datepicker介绍:参考:http://jqueryui.com/demos/datepicker/ css: .ui-datepicker { width: 300px; padding: .

datepicker介绍:
参考:http://jqueryui.com/demos/datepicker/

css:

.ui-datepicker { width: 300px; padding: .2em .2em 0;}
.ui-widget-header{background: none;border:none;}
.ui-datepicker-title{ border-bottom:1px solid #CCCCCC;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default
{border:none;background: none; text-align: center;} .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {color:#FFFFFF;} .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-activ{color:#FF0000;}

 

jquery:

var getCurrDate="";

$( "#datepicker" ).datepicker({
     regional:"zh-CN",                        //设置中文
     duration:"",                             //效果无
     showAnim:"",                             //效果无
     firstDay: 1,                             //从星期一开始
     minDate: +1,                             //设置可用最小值 +1 表示从今天加上一天
     maxDate:+14,                             //设置可用最大值 +14 表示从今天加上十四天
     showOn: "both",                          //设置input和img都可用
     buttonImage:"/calendar_icon.jpg",        //设置自定义图片按钮
     buttonImageOnly: true,                   //设置将图片作为按钮触发
buttonText:'选择日期' //设置img显示提示
     beforeShowDay:function(date){            //屏蔽星期一的使用
         var weeks = date.getDay();
         if(weeks == 1){  
                return [false];  
         }  
         return [true];
    },
    onSelect:function(dateText, inst){        //选择时触发
        getCurrDate=dateText;          
     },
     onClose:function(dateText, inst){        //关闭时触发
                        
     }
});

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章
最新文章
相关文章