最近在一個項目中,需要計算兩個日期的差值,我的第一反應是使用JavaScript的Date對象進行處理,但是在實際操作過程中發(fā)現(xiàn)不太好用,查了一下資料后發(fā)現(xiàn)使用jQuery的date插件可以更方便的計算日期差值。
首先需要引入jQuery和date插件的JS文件:
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
接著,在需要計算差值的HTML元素上添加date-picker類,然后在JavaScript中調(diào)用函數(shù)即可:
<input class="date-picker" id="startDate" type="text" value="2019-04-01" /> <input class="date-picker" id="endDate" type="text" value="2019-06-01" /> ... <script> $(function () { $(".date-picker").datepicker({ dateFormat: "yy-mm-dd", onSelect: function (date) { var startDate = $("#startDate").datepicker('getDate'); var endDate = $("#endDate").datepicker('getDate'); var timeDiff = Math.abs(endDate.getTime() - startDate.getTime()); var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24)); console.log(diffDays); } }); }); </script>
在這段JavaScript代碼中,我們首先獲取了開始日期和結(jié)束日期,然后使用Date對象計算兩個日期之間的時間差,最后通過除以每天的毫秒數(shù)得到了天數(shù)差值。
總的來說,使用jQuery的date插件能夠更方便的計算兩個日期之間的差值,而且還提供了一些方便的UI展示功能,推薦大家使用。