Jquery 将第二个日期字段值设置为自第一个选定日期字段值起7天后

我需要将第二个日期字段值设置为从第一个日期字段值开始7天后。当我选择第一个日期字段时，应该会发生这种情况。这是我的密码

<script type="text/javascript">
     function pageLoad() {

         $("[id$=txtToDate]").datepicker({
             'format': 'yyyy-mm-dd', autoclose: true, todayHighlight: true
         }).attr('readonly', 'readonly');
         $("[id$=txtFromDate]").datepicker({
             'format': 'yyyy-mm-dd', autoclose: true, todayHighlight: true
         }).attr('readonly', 'readonly');
     };

     </script>
    ////
     <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                            <div class="row">
                              <div class="col-md-10">
                                <div class="form-group">
                                    <label class="col-sm-2 control-label">From Date :</label>
                                    <div class="col-sm-4">
                                        <asp:TextBox ID="txtFromDate" runat="server" CssClass="form-control" AutoPostBack="True"></asp:TextBox>
                                    </div>
                                    <label class="col-sm-2 control-label">To Date :</label>
                                    <div class="col-sm-4">
                                        <asp:TextBox ID="txtToDate" runat="server" CssClass="form-control" AutoPostBack="True"></asp:TextBox>
                                    </div>
                                </div> 
                             </div>
                          </div>


    </asp:UpdatePanel>

---

您可以使用$[id$=txtFromDate].datepickergetDate和第一个日期选择器的更改事件捕获值，并使用更新的日期值设置第二个日期选择器的minDate选项。以下是完成任务的示例：

$("[id$=txtFromDate]").datepicker({
   'format': 'yyyy-mm-dd', 
   autoclose: true, 
   todayHighlight: true,
}).attr('readonly', 'readonly').change(function() {
    var date2 = new Date($("[id$=txtFromDate]").datepicker("getDate"));
    date2.setDate(date2.getDate() + 7); // set 7 days ahead
    $('[id$=txtToDate]').datepicker("setDate", date2); // set date value of second datepicker
    $('[id$=txtToDate]').datepicker("option", "minDate", date2); // set minimum date of second datepicker
});

注意：您可以使用date2.setDatedate2.getDate-7对txtToDate执行相反的操作；和txtFromDate作为目标，以便两个日期选择器都可以自行调整

附加说明：如果您遇到datepicker选择器问题，并且未使用ClientIDMode=Static，请将$[id$=datepickerid]替换为$，如下示例所示：

$("<%= txtFromDate.ClientID %>").datepicker({
   'format': 'yyyy-mm-dd', 
   autoclose: true, 
   todayHighlight: true,
}).attr('readonly', 'readonly').change(function() {
    var date2 = new Date($("<%= txtFromDate.ClientID %>").datepicker("getDate"));
    date2.setDate(date2.getDate() + 7); // set 7 days ahead
    $('<%= txtToDate.ClientID %>').datepicker("setDate", date2); // set date value of second datepicker
    $('<%= txtToDate.ClientID %>').datepicker("option", "minDate", date2); // set minimum date of second datepicker
});

---

工作示例：

是否要将第二个日期选取器的开始日期设置为比第一个日期选取器提前7天？如果这是您想要的，那么在更改第一个日期选择器时，听起来应该是这样的：$'[id$=txtToDate]'。日期选择器'setStartDate'，e.date.getDate+7；是的，这就是我想要的。我对这些东西不熟悉，你能告诉我什么是我应该称之为这个的事件吗？你的页面加载没有运行？没有，它正在运行。我是否应该将此java脚本代码添加到pageload？浏览器控制台中是否出现错误，或者日期选择器是否工作不正常？如果clientdmode未设置为Static，则可能需要like作为选择器。