Question

我使用JQuery datepicker，问题是我生成了HTML，因此我事先并不知道字段的ID。

我的代码可以在http://jsfiddle.net/littlesandra88/KrEqk/

上试用

生成以下表单，其中ID只是以随机数为前缀，以使它们不同。

我在这些字段中获取datepicker的做法是将class="datepick"添加到这些字段中

<input name="from" id="114_begin_date" value="16/05-2011" type="text" class="datepick" />
<input name="to"   id="114_end_date"   value="16/05-2011" type="text" class="datepick" />

并将.datepick添加到内联日期选择器JavaScript，就像这样

var dates = $("#from, #to, .datepick").datepicker({

如果您尝试多次更改日期，则会注意到所有字段都已更新=（

如何防止这种情况发生，所以我点击的字段会被更改？

Answer 1

问题出在onSelect处理程序

中

您正在运行

dates.not(this).datepicker("option", option, date);

这会将所有其他日期选择器更改为单个值（当前日期选择器之一）..

更新 以发表评论

将您的onSelect方法更改为

onSelect: function(selectedDate) {
                  var self = this;
                  var option = this.name == "from" ? "minDate" : "maxDate",
                  instance   = $(this).data("datepicker"),
                  date       = $.datepicker.parseDate(
                                  instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
                  dates.filter(function(){return this.form === self.form;}).not(this).datepicker("option", option, date);
               }

所做的更改

添加var self = this;以供日后使用
使用name属性代替id来决定使用哪个限制
而不是将新的日期限制应用于所有其他日期选择器（我假设你从只有两个日期选择器存在的地方拍摄了那部分），我们将它们过滤到相同形式的那些作为我们改变的人。（实际上是另一个，在同一行。请记住，这仅适用于每个名为from和to 的表单的两个日期选择器。

演示http://jsfiddle.net/gaby/Wy6qT/

Answer 2

嗯，我不熟悉datepicker，但你可以试试：

$("#from, #to, .datepick").each(
    $(this).datepicker({/*... some settings? */});
}

为什么我更改时会更新所有字段？

2 个答案: