在模態中設置日期輸入類型框的當前日期

在我的頁面上，我有一個以模態打開的窗體。它有幾個字段，日期就是其中之一。我想將它設置爲今天的默認日期。我的語氣可以看出以下在模態中設置日期輸入類型框的當前日期

<!--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函數，例如通過與輸入印刷機的投入去，按下時輸入等

一個提交表單該功能是設置日期爲#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中打開上面的代碼時，它似乎沒有將日期框識別爲日期輸入類型。

來源

2017-01-13 ArtleMaks

在形式你有id作爲日期選擇器和您試圖訪問日期P使用jQuery icker（注意資本P）。

來源

2017-01-13 14:35:33

真的，我錯過了一個。我現在改了它，但它似乎仍然沒有在Chrome中設置日期。它似乎在Firefox中工作，但正如我所說，Firefox不會將輸入類型識別爲日期。 – ArtleMaks

@ArtleMaks ctrl + shift + r（或cmd + shift + r）刷新Chrome中的緩存js。 jquery應該在兩個瀏覽器中都有同樣的表現。 –

@Iwrestledabearonce。這就是我想過的，但似乎並非如此。你可以嘗試在Firefox和Chrome中打開這個http://easycount.io/platform/fooddeliveries.php?id=9，這樣我可以看到它在我的身邊嗎？ – ArtleMaks

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

所以得到的字符串將是：

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

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

來源

2017-01-13 14:46:09

在模態中設置日期輸入類型框的當前日期

回答

相關問題