jQuery UI日期选择器 - 在选择日期时更新另一个日期选择器

Question

我有2个使用JQuery UI的日期选择器。如果用户从日期选择器1中选择一个日期，我怎样才能在相同的日期自动更新日期选择器2？

我认为这可能很简单，但我已经尝试了几件事情，似乎没有任何工作。

在此先感谢。

Answer 1

日期选择器本质上是一个文本输入元素。您可以使用第一个输入元素上的jQuery变更处理程序在变更内容时获取其内容，然后只需选择第二个输入元素并使用jquery val更新该值。

http://api.jquery.com/change/ http://api.jquery.com/val/

喜欢的东西：

$("#firstdatepicker").change( function() { 
    $("#seconddatepicker").val($(this).val()); 
}); 

Answer 2

您将要使用onClose事件来更新第二个文本字段。

我创建了this fiddle这里工作;出于某种原因，通常在日期选择器上的样式不会进入。

HTML：

<input type="text" name="date1" value="" /> 
<br> 
<input type="text" name="date2" value="" /> 

的Javascript：

$("input[name=date1]").datepicker({ 
    onClose: function(dateText, inst) { 
     $("input[name=date2]").val(dateText); 
    } 
}); 
$("input[name=date2]").datepicker();