Jquery - 将从datepicker中选择的值显示到另一个文本框中

Question

我正在使用jquery从文本框中选择值并将其显示在摘要页面上的所有设计的不同文本框中（全部设计在同一页面上）。例如，我有以下的HTML：

<label for="txt-outbound-date" class="left p-input-label" >Date: </label> 
<input type="text" id="txt-outbound-date" name="txt-outbound-date" class="input-txt-sml left required" /> 

摘要页面HTML：

<div class="div-contact-label-wrap"> 
    <label for="txt-selected-date" class="right p-input-label" >Outbound Date: </label> 
</div> 
<div class="div-contact-input-wrap"> 
    <input type="text" id="txt-selected-date" name="txt-selected-date" class="input-txt-sml left" disabled="disabled" /> 
</div> 

jQuery代码：

$('#txt-outbound-date').change(function() { 
    $('#txt-selected-date').val($(this).val()); 
}); 

这对于每一个文本框的工作完全没有问题。我除了为'选择日期“文本框，它使用jquery datepicker来获取选定的值。当我选择一个值并进入摘要页面时，不会复制任何值。如果我回到上一页并选择其他日期，则先前选择的日期将显示在文本框中。

有没有人有任何想法我可以解决这个问题？

我也试过：

$('#txt-outbound-date').click(function() { 
    $('#txt-selected-date').val($(this).val()); 
}); 

但是，这也不能工作。有什么建议吗？

Answer 1

您可以使用日期选择器事件onSelect：

$('#txt-outbound-date').datepicker({ 
    onSelect: function(dateText, inst) { 
     $('#txt-selected-date').val(dateText); 
    } 
}); 

Answer 2

该解决方案（日期选择器事件ONSELECT）这种类型的日期选择器

params.datepicker = { 
    selector: '#startdate, #enddate, minDate:'<%=date()%>' 
    } 

这里该解决方案仅适用，如果你不工作在文本框中键入或在点击日期选择器图标图标后将光标置于文本框中

$(document).ready(function() { 
$('#startdate').click(function() { 
      var inputValues = []; 
      $("#startdate").each(function() { 
       inputValues.push($(this).val()); 
      }); 
      $('#enddate').each(function(index) { 
       if(index < inputValues.length) { 
        $(this).val(inputValues[index]); 
       } 
      }); 
     }); 
}); 

这个解决方案可以很好地HTML5 /次bootstrap（但我在寻找一个老的解决方案与wet2模板与旧版本的日期选择器的）

$('#startdate').change(function(){ 
    $('#enddate').val($(this).val()); 
})