2010-05-20 51 views
0

我这样写的..

设置minDate在jquery datepicker没有发生?

<script> 


$(function() { 
        $('#from').datepicker({ 
          defaultDate: "+5d", 
          changeMonth: true, 
          numberOfMonths:1 , 
          minDate:"+0d", 
          dateFormat: 'DD, MM d, yy', 
          onSelect: function(selectedDate) { 
            var option = this.id == "from" ? "minDate" : "maxDate"; 

            var instance = $(this).data("datepicker"); 

            var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 


            dates.not(this).datepicker("option", option, date); 

          } 
        }); 

}); 

$(function() { 
    $('#to').datepicker({ 
          defaultDate: "+5d", 
          changeMonth: true, 
          numberOfMonths:1 , 
          minDate:"+0d", 
          dateFormat: 'DD, MM d, yy', 
          onSelect: function(selectedDate) { 
            var option = this.id == "from" ? "minDate" : "maxDate"; 

            var instance = $(this).data("datepicker"); 

            var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings); 


            dates.not(this).datepicker("option", option, date); 

          } 
        }); 
}); 

function callme(id){ 
    var temp1 = "#" + id; 
    if(temp1 == "#from"){ 
     $("#to").unbind(); 
    } 
    else{ 
     var temp = $("#from").val(); 
     var msecsInADay = 86400000; 
     var startDate = new Date(temp); 
     var endDate = new Date(startDate.getTime() + msecsInADay); 
     var t = endDate.getDate() + '/' + (endDate.getMonth()+1) + '/' + endDate.getFullYear(); 

     $('#to').datepicker({minDate: new Date(t)}); 
     $('#to').datepicker().datepicker("show"); 
    } 
} 
</script> 


</head> 

<body> 
    <label>date</label><input id="from" type="text" onclick="callme(this.id)"/> 
    <label>return</label><input id="to" type="text" onclick="callme(this.id)" /> 


现在我想的是....
当我选择的第一个日期。 [今日日期前的#from]的意思应该在日历中禁用。
现在当我选择日历日期中的第二个日期[平均值“#to”]应该开始一天加。然后是以前的日期

但是这里的最短日期没有改变。

在此先感谢...

回答

1

如果我理解你的问题(和代码,因为所提供的代码确实比你更规范),你想要的以下行为:

  1. 当日期, F,在#from被选中,你应该只能选择大于F的日期#to
  2. 当选择了日期,T,在#to,大于或等于T没有日期应选择在#from

此代码将执行以下操作:

$(function() { 
    $('#from').datepicker({ 
     defaultDate: '+5d', 
     changeMonth: true, 
     numberOfMonths:1, 
     minDate:'+0d', 
     dateFormat: 'DD, MM d, yy', 
     onClose: function(dateText, inst) { 
      if (dateText !== '') { 
       try { 
        var fromDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings); 
        fromDate.setDate(fromDate.getDate() + 1); 
        $('#to').datepicker('option', 'minDate', fromDate); 
       } 
       catch (err) { 
        console.log(err); 
       } 
      } 
      else { 
       //If #from is empty, restore the original limit in #to 
       $('#to').datepicker('option', 'minDate', '+0d'); 
      } 
     } 

    }); 

    $('#to').datepicker({ 
     defaultDate: '+5d', 
     changeMonth: true, 
     numberOfMonths:1, 
     minDate:'+0d', 
     dateFormat: 'DD, MM d, yy', 
     onClose: function(dateText, inst) { 
      if (dateText !== '') { 
       try { 
        var toDate = $.datepicker.parseDate(inst.settings.dateFormat, dateText, inst.settings); 
        toDate.setDate(toDate.getDate() - 1); 
        $('#from').datepicker('option', 'maxDate', toDate); 
       } 
       catch (err) { 
        console.log(err); 
       } 
      } 
      else { 
       //If #to is empty, remove the limit in #from 
       $('#from').datepicker('option', 'maxDate', null); 
      } 
     } 
    }); 
}); 

两个onClose功能是非常相似的,可以概括为一个函数,但我认为这很容易理解这种情况。

另外,#from#to中的onClick处理程序不再需要。

相关问题