目前，我正在嘗試使用運行良好的 moment.js 計算他的天數，但是當我嘗試格式化日期時，我收到錯誤消息。
這是我的 jsfiddle鏈接
$fromDate.datepicker().on('change', function () {
$toDate.datepicker('option', 'minDate', $(this).val());
$numberDays.val(calculateDateDiff($toDate.val(), $(this).val()));
$fromDate.format('YYYY-MMM-DD');
});
錯誤
TypeError: $fromDate.format is not a function
這是我正在尋找的日期格式 22-Nov-2021
$formDate是一個 jQuery 對象，因此它不支持該format()方法，該方法是 Moment 庫的一部分。
要執行您需要的操作，您可以使用datFormatjQueryUI datepicker 庫的參數來設置日期格式：
$(function() {
let $fromDate = $('#fromdate'),
$toDate = $('#todate'),
$numberDays = $('#numberdays');
$fromDate.datepicker({
dateFormat: 'yy-mm-dd'
}).on('change', function() {
$toDate.datepicker('option', 'minDate', $(this).val());
$numberDays.val(calculateDateDiff($toDate.val(), $(this).val()));
});
$toDate.datepicker({
dateFormat: 'yy-mm-dd'
}).on('change', function() {
$fromDate.datepicker('option', 'maxDate', $(this).val());
$numberDays.val(calculateDateDiff($(this).val(), $fromDate.val()));
});;
function calculateDateDiff(endDate, startDate) {
if (endDate && startDate) {
let e = moment(endDate),
s = moment(startDate);
return e.diff(s, "days");
}
return null;
}
});.row {
background: #f8f9fa;
margin-top: 20px;
}
.col {
border: solid 1px #6c757d;
padding: 10px;
}<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script type="text/javascript" src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<script type="text/javascript" src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<div class="container">
<div class="row">
<div class="col-12 form-group has-feedback">
<label>From <span class="text-danger">*</span></label>
<input type="text" class="form-control has-feedback-left" id="fromdate" placeholder="YYYY-MM-DD" name="fromdate">
</div>
<div class="col-12 form-group has-feedback">
<label>To <span class="text-danger">*</span></label>
<input type="text" class="form-control has-feedback-left" id="todate" placeholder="YYYY-MM-DD" name="todate">
</div>
<div class="col-12 form-group has-feedback">
<label>Number of days <span class="text-danger">*</span></label>
<input type="text" class="form-control has-feedback-left" name="numberdays" id="numberdays" disabled>
</div>
</div>
</div>Dieser Artikel stammt aus dem Internet. Bitte geben Sie beim Nachdruck die Quelle an.
Bei Verstößen wenden Sie sich bitte [email protected] Löschen.
Lass mich ein paar Worte sagen