在模式中为日期输入类型框设置当前日期

Question

在我的页面上，我有一个以模式形式打开的表单。 它有几个字段，日期是其中之一。 我想将其默认设置为今天的日期。 我的模态可以在下面看到

    <!--main modal-->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog">

      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header" style ="background-color: #38BFEF;">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title"><center><font color="white">New Food Delivery</font></center></h4>
        </div>
        <div class="modal-body">

 <!---inside pop up content start-->
  <form>
  <center>
    <p>
        <label for="Delivery Number">Delivery Number:</label>
        <input type="text" name="delivery_number" id="delNumber" style="width:150px;" autofocus="autofocus">
    </p>
    <p>
        <label for="Delivery Date">Delivery Date:</label>
        <input type="date" name="datepicker" style="margin-left:4%;width:150px;" id="datepicker">
    </p>
    <p>
        <label for="Supplier">Supplier:</label>
        <input type="text" name="supplier" style="margin-left:10%;width:150px;" id="supplier">
    </p>
     <p>
        <label for="Supplier">Cost of Delivery:</label>
        <input type="text" name="cost" style="margin-left:1%;width:150px;" id="cost">
    </p>
    </center>
    <center><input type="button"  id="submit" class="btn btn-info btn-lg vbtn" value="Submit" onclick="submitDelivery()" data-toggle="modal" data-target="#confirmModal"></center>
</form>


 <!---inside pop up content end-->
       </div>
        <div class="modal-footer" style ="background-color: #38BFEF;">
          <input type="button" id="close" class="btn btn-default" data-dismiss="modal" value="Cancel">
        </div>
      </div>

    </div>
    </div>

然后，我有几个针对不同事物的javascript函数，例如使用enter press进行输入，按下enter时提交表单等。

功能之一是为#datepicker设置日期，它看起来像这样

$('#myModal').on('shown.bs.modal', function (e) {
     $('#delNumber').focus();

    var now = new Date();
    var day = ("0" + now.getDate()).slice(-2);
    var month = ("0" + (now.getMonth() + 1)).slice(-2);

    var today = (day)+"/"+(month)+"/"+ now.getFullYear();
    //alert(today);
    $('#datePicker').val(today);
})

但是，当我在Chrome中打开模态时，框中仍然显示dd / mm / yyyy，似乎该功能无法正常工作？

另一个问题是，当我在Firefox中打开上述代码时，似乎无法将“日期”框识别为日期输入类型。

Answer 1

在形式上，你有id作为日期选择器 ，并且您使用jQuery的试图访问日期P icker（注意资本P）。

Answer 2

而不是使用DD/MM/YYYY您需要使用格式YYYY-MM-DD

因此，结果字符串将是：

 var today = (now.getFullYear() + '-' + month + '-' + day);
 $('#datepicker').val(today);

这是工作示例： https : //jsfiddle.net/panamaprophet/2Lt2q3ga/