根据选择框更改jquery变量的值

时间:2010-04-27 00:46:02

标签: javascript jquery datepicker

我有一个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);
            }
        });
    });

2 个答案:

答案 0 :(得分:2)

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

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]);
});

这有两个更改,我们正在调用.datepicker('option', 'minDate', val)方法,我们正在使用一个对象来映射日期范围以稍微清理它。这只会让您根据您的选择选择15天,6天或10天的日期。

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

答案 1 :(得分:0)

修改您的更改处理程序,以便在选择框更改时更新datepicker。初始化后,请参阅modifying minDate的datepicker文档和其他选项。该函数将接受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);
});