datepicker disabledate 禁用当前年之外的年份 和当前月之后的月份

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了datepicker disabledate 禁用当前年之外的年份 和当前月之后的月份相关的知识,希望对你有一定的参考价值。

参考技术A JS部分:

data() 

    return 

      pickerOptions: 

        disabledDate(time) 

          /**

          * 大于当前月分的日期不可选

          */

          //获取时间,当前的月份

          const date = new Date()

          const year = date.getFullYear()

          let month: any = date.getMonth() + 1

          if (month >= 1 && month <= 9) 

            month = '0' + month

          

          const currentdate = year.toString() + month.toString()

          // 获取时间选择器上选择的月份    

          const timeyear = time.getFullYear()

          let timemonth:any = time.getMonth() + 1

          if (timemonth >= 1 && timemonth <= 9) 

            timemonth = '0' + timemonth

          

          const timedate = timeyear.toString() + timemonth.toString()

          return time.getTime() < new Date(new Date().getFullYear().toString()).getTime() || currentdate <= timedate

        ,

      ,

      value1: '',

    

  

html部分:

 <el-date-picker

          v-model="time"

          type="month"

          size="mini"

          popper-class="yy-time"

          value-format="yyyyMM"

          placeholder="选择年月"

          @change="fetchData"

          :style=" width: getSwitchWIdth(120) + 'px' "

          :clearable="false"

          :picker-options="pickerOptions"

        ></el-date-picker>

根据datepicker上选择的日期禁用整周

我有一个使用jQuery UI创建的.datepicker(),我现在想这样做:

  1. 禁用所有周末和假日,
  2. 用户选择一周中的一天后,禁用整周。假设用户选择星期二,2014年9月23日,那么datepicker应该禁用星期一,2014年9月22日 - 星期日,09/28/2014。

我在考虑beforeShowDayonSelect功能,但我不知道如何将我的要求结合在一起。

一些小代码可能有所帮助:

$("#datepicker").datepicker({
    showOn: "button",
    buttonImage: "/painstorder/jquery-ui/images/calendar.gif",
    buttonImageOnly: true,
    minDate: "dateToday",
    maxDate: new Date(2016, 2, 6),     
    buttonText: "Select date",
    dateFormat: "DD, d MM, yy",
    beforeShowDay: $.datepicker.noWeekends
});
答案

在这里你是一个工作的例子http://jsfiddle.net/L25d7Lzy/1/

$("#datepicker").datepicker({
    minDate: "dateToday",
    maxDate: new Date(2016, 2, 6),     
    buttonText: "Select date",
    dateFormat: "DD, d MM, yy",

    beforeShow: function () {
        if ($('#datepicker').val()) {
            var thedate = new Date($('#datepicker').val());
            var minDate = new Date(thedate.setDate(thedate.getDate() + 7));
            $('#datepicker').datepicker("option", "minDate", minDate);
        }
    },
    beforeShowDay: $.datepicker.noWeekends,
});

你可以根据自己的需要修改:)

以上是关于datepicker disabledate 禁用当前年之外的年份 和当前月之后的月份的主要内容,如果未能解决你的问题,请参考以下文章

datepicker 禁用期货日期

Bootstrap-datepicker禁用当天之前/之后的日期

使用 mysql 在 datepicker 中禁用天数

Material DatePicker 禁用年份选项

datepicker:使用下拉列表禁用天数?

JQuery ui - datepicker,禁用特定日期