如何在datepicker的JQUERY中设置当前日期和当前日期+ 9个月的3年

时间:2015-05-29 04:13:25

标签: javascript jquery ios iphone html5

enter image description here

Hey Iam使用html5日期属性,它需要一些来自过去年份和未来日期的限制动态,具有今天的当前日期/年。

DEMO

  • 从当前日期算起的3年

  • 从当月起+9个月

示例:

当前年份是2015-3 = 2012 + 9个月

JS:

var checkUserAgent = navigator.userAgent;
      // if (checkUserAgent.match(/iPad/i) || checkUserAgent.match(/iPhone/i)) {
            $('meta[name=viewport]').attr('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no');
            var checkBabyId1 = $('#babys_due_date_id').length > 0;
            if (checkBabyId1 == true) {

                // logic for 9 months 
                var myMonths = 9;
                var CurrentDate = new Date();
                CurrentDate.setMonth(CurrentDate.getMonth() + myMonths);

                console.log(CurrentDate) // adding 9 months 

                // logic for - 3 years
                var myPastYears = 3;
                var CurrentYear = new Date();
                CurrentYear.setYear(CurrentYear.getYear() - myPastYears )
                console.log(CurrentYear) // - 3years


                $('#ui-datepicker-div').hide();
                $('#babys_due_date_id.date-padding label').hide();
                $('#babys_due_date_id')
                .find('input')
                .prop({
                    /*'readonly':'true', */
                    'type':'date'/*,
                    'min' : '2012-01-01',
                    'max' : '2016-12-01'*/
                })
                .css({ 
                    'border':'1px solid #f00 !important',
                    'width':'200px','margin-top':'10px' 
                });

                $('#babys_due_date_id label').on('click', function(e){
                    e.preventDefault();
                    $('#ui-datepicker-div').hide();
                });

                $('#babys_due_date_id-datepicker-popup-0').on('click', function(){
                    $('#ui-datepicker-div').remove();
                    $('#ui-datepicker-div').datepicker( "option", "disabled", true );
                });
            }
      // }

1 个答案:

答案 0 :(得分:1)

使用minDate选项:

$('#ui-datepicker-div').datepicker( "option", "minDate", "-3y +9m");

http://api.jqueryui.com/datepicker/#option-minDate

或:

<script>
  var now = new Date();
    var year = now.getFullYear() - 3;
    var month = now.getMonth() - 8; // jan = 0
    if (month < 0) {
      month = 11 + month;
      year++;
    }

  $('#datepicker').attr("min", year+'/'+month+'/'+now.getDate());
</script>

表示简单<input type="date">