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){        //关闭时触发
                        
     }
});
目录
相关文章
|
JavaScript 前端开发
jquery datepicker只显示年和月
                      //中文汉化                      $(function() {          $('#Datepicker').
1348 0
|
Web App开发 JavaScript
jquery UI datepicker时间控件的使用
参考: http://api.jqueryui.com/datepicker/#method-show 英文 http://www.helloweba.com/view-blog-168.html  中文 http://jqueryui.
1089 0
|
JavaScript
jquery datepicker 显示12个月份
jquery datepicker 显示12个月份 并按照财年显示,财年第一个月为5月份。 显示月份数量:numberOfMonths:12, 默认第一个显示的月份 defaultDate:(new Date(new Date().
955 0
|
JavaScript
jquery ui datepicker 只能选今天以后的日期
 $("input[name=begintime],input[name=endtime],input[name=Arrivedate]").datepicker({dateFormat:"yy-mm-dd",minDate: new Date()});
1889 0
|
Web App开发 前端开发 JavaScript
[jQuery筆記] 好用的日期函式 datepicker
最近在学习 javascript,当然首推的就是 jQuery 了,之前因為懒得做日期表单,因為日期表单需要三种栏位,一个是年,一个是月,一个是日,相当麻烦,一直在那边 for 迴圈也不是办法,虽然那是个解决方法,然后我之前用了xt:Commerce 这套 opensource的程式码,把...
928 0
|
JavaScript 前端开发 搜索推荐
jQuery日期弹出选择框Datepicker效果
无论你是一个机票在线预定网站设计师,还是一个工程任务管理者,抑或在你的注册表单上有个生日填写项目;本文即将提到的日历日期选择弹出窗口都将帮助你简化用户操作,提高网站的用户体验和易用性。 教程目标:教会大家如何jQuery的UI插件Datepicker通过短短几行JavaScript代码制作一个日期选择弹出窗口,当用户在弹出的日期选择框中选择一个日期后,该日期会自动填充到Input框中(INPUT中值的后台读取与手动输入所获得的值没有任何区别)。
1381 0