基于选择框更改jquery变量的值答案

【问题标题】：Change value of jquery variable based on a select box基于选择框更改jquery变量的值
【发布时间】：2010-04-27 00:46:01
【问题描述】：

我有一个 jquery datepicker 脚本，我想做的是通过选择框更改“minDate: 10”值。如果选择了第一个选项 minDate:10 ，如果选择了第二个选项则 minDate:20 等等...

每次我选择不同的选项时，它会实时更新日期选择器吗？

提前致谢！

$(function() {
               $('#hotel').change(function() {
                 // assign the value to a variable, so you can test to see if it is working
                 var selectVal = $('#hotel :selected').val();
                 if( selectVal == "hotel_c" ) {
                var date = 10;
                 }
                 if( selectVal == "hotel_a" ) {
                var date = 15;
                 }
                 if( selectVal == "hotel_b" ) {
                var date = 6;
                 }
                });
        var dates = $('#from, #to').datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            dateFormat: 'yy-m-d',
            minDate: 10,
            numberOfMonths: 3,
            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);
            }
        });
    });

【问题讨论】：

标签： javascript jquery datepicker

【解决方案1】：

您可以像这样编写更改处理程序：

var hotelMap = { hotel_a: 15, hotel_b: 6, hotel_c: 10 };
$('#hotel').change(function() {
  var selectVal = $('#hotel :selected').val();
  $("#from, #to").datepicker("option", "minDate", hotelMap[selectVal]);
});

这有 2 个变化，我们调用 .datepicker('option', 'minDate', val) 方法，并且我们使用一个对象来映射日期范围以稍微清理它。这只会让您选择 15、6 或 10 天后的日期，具体取决于您的选择。

You can see this with the rest of your code working here

【讨论】：

【解决方案2】：

修改您的更改处理程序，以便在选择框更改时也更新日期选择器。请参阅 datepicker 文档以了解 modifying minDate 和初始化后的其他选项。该函数将接受date object 或表示日期的字符串。从今天起，分配号码将不允许 date 天。

$('#hotel').change(function() {
    ...
    var date = // somehow get the date

    // update the date picker
    // need to construct a date string or a date object here
    // will disallow "date" days from today
    $('#from, #to').datepicker('option', 'minDate', date);
});

【讨论】：