Javascript jQuery Datepicker-根据所选选项刷新可拾取的天数

Javascript jQuery Datepicker-根据所选选项刷新可拾取的天数,javascript,jquery,datepicker,Javascript,Jquery,Datepicker,我有一个选择框,用户可以选择3个不同的商店。2号店和3号店不可能选择周末,1号店只能选择周一到周六 以下javascript仅在第一次选择时起作用。如果你马上选择另一家商店,它将坚持旧的选择 我试过使用$(“#datepicker”).datepicker(“刷新”)(请参阅),但没有成功。我开始认为问题出在别处 Javascript: $(function() { var setting, currentShop = 0; /* Select box */ $('select

我有一个选择框,用户可以选择3个不同的商店。2号店和3号店不可能选择周末,1号店只能选择周一到周六

以下javascript仅在第一次选择时起作用。如果你马上选择另一家商店,它将坚持旧的选择

我试过使用
$(“#datepicker”).datepicker(“刷新”)(请参阅),但没有成功。我开始认为问题出在别处

Javascript:

$(function() {

  var setting, currentShop = 0;

  /* Select box */

  $('select#shop').change(function() {
    (currentShop = $(this).val() == 1) ? loadDatePicker(setting = 'noSunday') : loadDatePicker(setting = 'noWeekends');
  });

  /* Datepicker */

  function noSunday(date){ 
    var day = date.getDay(); 
    return [(day > 0), '']; 
  }

  function loadDatePicker(setting) {
    if(setting == 'noWeekends') {
      $( "#datepicker" ).datepicker({ beforeShowDay: $.datepicker.noWeekends, minDate: +2, maxDate: "+1M" }); 
    }
    if(setting == 'noSunday') {
      $( "#datepicker" ).datepicker({ beforeShowDay: noSunday, minDate: +2, maxDate: "+1M" }); 
    }
    $( "#datepicker" ).datepicker("refresh");
  }
});
  <select id="shop" name="shop">
    <option value="0" selected="selected">Choose a shop</option>
    <option value="1">1 (closed sundays)</option>
    <option value="2">2 (closed weekends)</option>
    <option value="3">3 (closed weekends)</option>
  </select>
  <label for="datepicker">Datepicker</label><input type="text" name="date" id="datepicker" value="" readonly="readonly" />
HTML:

$(function() {

  var setting, currentShop = 0;

  /* Select box */

  $('select#shop').change(function() {
    (currentShop = $(this).val() == 1) ? loadDatePicker(setting = 'noSunday') : loadDatePicker(setting = 'noWeekends');
  });

  /* Datepicker */

  function noSunday(date){ 
    var day = date.getDay(); 
    return [(day > 0), '']; 
  }

  function loadDatePicker(setting) {
    if(setting == 'noWeekends') {
      $( "#datepicker" ).datepicker({ beforeShowDay: $.datepicker.noWeekends, minDate: +2, maxDate: "+1M" }); 
    }
    if(setting == 'noSunday') {
      $( "#datepicker" ).datepicker({ beforeShowDay: noSunday, minDate: +2, maxDate: "+1M" }); 
    }
    $( "#datepicker" ).datepicker("refresh");
  }
});
  <select id="shop" name="shop">
    <option value="0" selected="selected">Choose a shop</option>
    <option value="1">1 (closed sundays)</option>
    <option value="2">2 (closed weekends)</option>
    <option value="3">3 (closed weekends)</option>
  </select>
  <label for="datepicker">Datepicker</label><input type="text" name="date" id="datepicker" value="" readonly="readonly" />

选择一家商店
1(星期日休息)
2(周末休息)
3(周末休息)
日期选择器
Jsfiddle:

如何使用datepicker正确刷新/应用设置?

请参见:

  function loadDatePicker(setting) {
    $("#datepicker").datepicker("destroy");
    if(setting == 'noWeekends') {
      $( "#datepicker" ).datepicker({ beforeShowDay: $.datepicker.noWeekends, minDate: +2, maxDate: "+1M" }); 
    }
    else if(setting == 'noSunday') {
      $( "#datepicker" ).datepicker({ beforeShowDay: noSunday, minDate: +2, maxDate: "+1M" }); 
    }
    $( "#datepicker" ).datepicker("refresh");
  }
您需要放入
$(“#日期选择器”)。日期选择器(“销毁”)每次更改设置之前

$("#datepicker").datepicker("destroy");

用于清除日期选取器(“#日期选取器”)。日期选取器(“销毁”)

看起来是个解决办法。虽然每次破坏它都让人觉得有点奇怪,但对于这个小项目,我想没关系。请添加一个解释,这样它就能躲过低质量的子弹。