Question

我有一个页面，其中包含使用标准jQuery UI的多个datepicker文本字段。我想将默认的datepicker日期设置为所有空白字段的最后一个选定日期或月份，因此用户无需手动更改他们选择的每个日期选择器的月份。

我已尝试通过datepicker的onSelect函数将日期值存储在变量中，但我不确定如何绑定defaultDate属性，因此它会使用上次选择的日期更新所有日期选择器。

以下是基本代码。同样，如果用户将其中一个日期文本字段设置为10/20/2011，当他或她通过任何空白文本字段打开另一个日期选择器时，默认情况下，日期选择器应显示十月（而不是今天的当前日期）。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css" />

    <script type="text/javascript">
        $(document).ready(function() {

            $(".datepicker").datepicker({
                changeMonth: true,
                changeYear: true
            });
        });
    </script>
</head>

<body>

    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" /> <br />
    <input type="text" class="datepicker" />

</body>

</html>

Answer 1

怎么样：

$(".datepicker").datepicker({
    changeMonth: true,
    changeYear: true,
    onSelect: function(dateText, inst) {
        $(".datepicker").datepicker("option", "defaultDate", dateText);
    }
});

使用defaultDate选项和onSelect事件。

以下是一个有效的例子：http://jsfiddle.net/MXHdj/

记住跨多个字段的jQuery UI datepicker中的最后一个选定月份

1 个答案: