jQuery/JavaScript 函数不更新文本框答案

【问题标题】：jQuery/JavaScript function not updating textboxjQuery/JavaScript 函数不更新文本框
【发布时间】：2013-05-02 14:37:36
【问题描述】：

我正在使用 Bootstrap DatePicker：https://github.com/eternicode/bootstrap-datepicker

我将它附加到两个盒子 - InvDate 和 InvDueDate - 它弹出来没问题，并设置日期等就好了。

我有一个下拉盒子，即在选择时，我想在Invdate框中取出日期，并将DropdownList的Val（）添加到Invdate，并填充Invduedate。

但是，我似乎无法让 InvDueDate 更改它的日期（什么都不做） - 下拉框确实触发了该功能，但这一行似乎没有做任何事情：

$("#InvDueDate").datepicker("setDate", duedate);:

HTML 是：

        <div class="editor-label">
        <label for="InvDate">InvDate</label>
    </div>
    <div class="editor-field">
        <input class="textbox datepicker" data-val="true" data-val-date="The field InvDate must be a date." data-val-required="The InvDate field is required." id="InvDate" name="InvDate" type="text" value="02 May 2013" />
        <span class="field-validation-valid" data-valmsg-for="InvDate" data-valmsg-replace="true"></span>
    </div>



     <div class="editor-label">
       <label for="Terms">Terms</label>
    </div>
    <div class="editor-field">
      <select id="Terms" name="Terms"><option value="0">Due on invoice date</option>
        <option value="7">Net 7 days</option>
        <option value="14">Net 14 days</option>
        <option value="21">Net 21 days</option>
        <option value="28">Net 28 days</option>
        <option value="45">Net 45 days</option>
        <option value="60">Net 60 days</option>
      </select>
    </div>

    <div class="editor-label">
        <label for="InvDueDate">InvDueDate</label>
    </div>
    <div class="editor-field">

        <input class="textbox datepicker" data-val="true" data-val-date="The field InvDueDate must be a date." data-val-required="The InvDueDate field is required." id="InvDueDate" name="InvDueDate" type="text" value="02 May 2013" />

        <span class="field-validation-valid" data-valmsg-for="InvDueDate" data-valmsg-replace="true"></span>
    </div>

我的 jQuery/Javascript 是：

<script type="text/javascript">
  $(document).ready(function () {
    $("#Terms").change(function () {
      var invdate = new Date();
      var duedate = new Date();
      invdate = $("#InvDate").val();
      var net = $("#Terms").val();
      duedate.setDate(invdate.getDate() + net);
      $("#InvDueDate").datepicker("setDate", duedate);
   });
  });
</script>

任何人都知道我哪里出错了吗？

更新以显示工作代码

    var start_date = new Date($('#InvDate').val());
    var duration = parseInt($('#Terms').val());
    var end_date = new Date();
    end_date.setDate(start_date.getDate() + duration);
    $("#InvDueDate").datepicker("setDate", end_date);

【问题讨论】：

check this
小提示：尝试使用console.log 调试日期，看看您的vars 格式是否正确。

标签： javascript jquery twitter-bootstrap datepicker

【解决方案1】：

我认为您的日期格式不正确，请参阅：

var invdate = new Date();

然后它被替换为

$('#invDate').val();

但应该是：

var invDate = new Date($('#invDate').val());

OR（如 zeroflagL 评论）

var invDate = $('#invDate').datepicker('getDate'); //gives you a Date object

【讨论】：

或var invDate = $('#invDate').datepicker('getDate');
我同意，但在我的记忆中，datepicker 字段上的 .val() 给出了正确的日期格式（不确定）。
是的，但如果你直接可以得到一个Date 对象... ;) 反正+1
谢谢 - 我已经根据 cmets 和建议简化了代码，并在问题中发布了“工作”JS。再次感谢大家的意见，我很感激。标记

【解决方案2】：

您确定 setDate 是 $.datepicker 可用的方法吗？它没有在文档中列出

这可能是您想要的？ https://github.com/eternicode/bootstrap-datepicker#update

【讨论】：

在github 上查看它的存在。