0

我的 JSP 中有以下代码，并将变量与淘汰赛 js 绑定。

我的js是

 calender: function () {
     console.log("in calender");
     var dates = $("#from1, #to1").datepicker({
     defaultDate: "+1w",
     changeMonth: true,
     numberOfMonths: 1,
     onSelect: function (selectedDate) {
         var option = this.id == "from" ? "minDate" : "maxDate",
             instance = $(this).data("datepicker"),
             date = $.datepicker.parseDate(
             instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
         dates.not(this).datepicker("option", option, date);
     }
 });
 },

而jsp是

 <div class="DateRange">
 <label for="from">From</label>
 <input type="text" id="from" name="from" data-bind="click: calender, value:    starDate"/>
 <label for="to">to</label>
 <input type="text" id="to" name="to" data-bind="click: calender, value: endDate"/>
 </div>

当我单击开始日期或结束结束日期时，将调用日历方法，但问题是第一次在第一个组件上单击日期选择器（仅调用方法），无论其 ID 是否。从下一次单击第二个组件开始，只有 datepicker 正常。我在这里缺少什么吗？

4

2 回答 2

0

它不会触发，因为输入实际上不是 datapicker()，直到它第一次通过 calendar 方法。第二次单击输入是一个数据选择器，因为它是在日历方法的第一次传递中设置的。

为什么不直接这样做而不是使用日历方法：

$("#from1, #to1").datepicker({...});
于 2012-04-11T15:43:37.980 回答
0

简而言之 1. 将数据选择器初始化移出日历方法。2.为每个字段创建两个单独的方法，它们将显示适当的日期选择器，即：

    $("#from1, #to1").datepicker({
     defaultDate: "+1w",
     changeMonth: true,
     numberOfMonths: 1,
     onSelect: function (selectedDate) {
         var option = this.id == "from" ? "minDate" : "maxDate",
             instance = $(this).data("datepicker"),
             date = $.datepicker.parseDate(
             instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
         dates.not(this).datepicker("option", option, date);

      }
    });    

    ........

    calenderFrom: function () {
     $("#from1").datepicker("show");
    }
    calenderTo: function () {
     $("#to1").datepicker("show");
    }

<input type="text" id="from" name="from" data-bind="click: calenderFrom, value:    starDate"/>
<input type="text" id="to" name="to" data-bind="click: calenderTo, value: endDate"/>

UPD 我假设您使用 jQueryUI 日期选择器。如果是这样，您实际上不需要手动显示它；只需初始化它

于 2012-04-11T15:41:46.177 回答