关于jqueryUi日期控件的心得

最新推荐文章于 2025-06-23 15:29:44 发布

paulxu_1008

最新推荐文章于 2025-06-23 15:29:44 发布

阅读量318

点赞数 1

CC 4.0 BY-SA版权

分类专栏： web前端文章标签： jqueryUi日历控件

本文链接：https://blog.youkuaiyun.com/paulxu_1008/article/details/87716566

web前端专栏收录该内容

5 篇文章

订阅专栏

本文主要探讨了在项目中应用jQueryUI日期控件的经验，强调了需要引入对应的JS和CSS文件。通过调整日期数组，可以实现对特定日期的启用或禁用功能，为交互提供更灵活的控制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jqueryUi 日历控件

注意事项

注意事项

.ui-icon-circle-triangle-w{
    background: url(../../image/date_left.png) !important;
}
.ui-icon-circle-triangle-e{
    background: url(../../image/date_right.png) !important;
}
.ui-datepicker-calendar thead tr th span{
    color: #555 !important;
}
css中要加这几个，图片是左右切换<>

要引入js和css 具体的配置，目前我所做的项目配置

  var daysArray =[];
    var dateObj = {
        default_date: "+1w",
        dayNamesMin: ['日', '一', '二', '三', '四', '五', '六'],
        monthNamesShort: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
        dateFormat: 'yy-mm-dd',
        changeMonth: true,
        prevBigText: '<<',
        changeYear: true,
        numberOfMonths: 1,
        minDate: new Date("2015/01/01"),
        maxDate: new Date(),
        beforeShowDay: function(date){
            var string = jQuery.datepicker.formatDate('yy-mm-dd', date);

            if( daysArray.indexOf(string) == -1 ){
                return [true,"","此日期没图片"];
            }else{
                return [true,"unclickdate"];
            }

        }
    }

通过改变数组的日期，重新调用这个控件，可以设置可点不可点日期！