计算一周中两天之间的夜晚数

Count number of nights between two days of the week

本文关键字：之间 一周 两天 计算      更新时间：2023-09-26

我正在尝试使用预订系统的jQuery计算一周中选定的两天之间的夜数，以指定人们可以在一周中的哪一天到达和离开。我有两个下拉菜单，一个是到达日期，一个是离开日期:

<select required="required" class="daypicker" id="arrivalday" name="arrivalday">
    <option></option>
    <option value="1">Monday</option>
    <option value="2">Tuesday</option>
    <option value="3">Wednesday</option>
    <option value="4">Thursday</option>
    <option value="5">Friday</option>
    <option value="6">Saturday</option>
    <option value="7">Sunday</option>
</select>
<select required="required" class="daypicker" id="departureday" name="departureday">
    <option></option>
    <option value="1">Monday</option>
    <option value="2">Tuesday</option>
    <option value="3">Wednesday</option>
    <option value="4">Thursday</option>
    <option value="5">Friday</option>
    <option value="6">Saturday</option>
    <option value="7">Sunday</option>
</select>

如果下拉框中的任何一个发生变化，则应按如下方式计算夜数:

arrival = Monday
departure = Friday
number of nights = 4

arrival = Monday
departure = Monday
number of nights = 7

arrival = Friday
departure = Monday
number of nights = 3

这是我到目前为止所做的，但是什么也没有发生:

$(document).ready(function(){    
$(".daypicker").change(function(){
var arrivalday = $("#arrivalday").val();
var departureday = $('#departureday').val();
if (arrivalday == departureday){
$('#numnights').html('7');
} else if (arrivalday < departureday) {
$('#numnights').html(departureday - arrivalday);
} else {
$('#numnights').html(arrivalday- departureday - 1);
}
}).change();
});

发现问题，在用户选择一个选项后显示选择，所以我将代码移到该选项的更改函数中，一切都如预期的那样工作。

您已经得到了它，您只需要为输出(numnights元素)创建容器。

无论如何，这样代码会更简洁一些:

$(document).ready(function(){    
    $(".daypicker").on('change', function(){calculateNights();});
});
function calculateNights() {
    var arrivalday = $("#arrivalday").val();
    var departureday = $('#departureday').val();
    var numberNights = departureday - arrivalday;
    numberNights = (numberNights < 1) ? numberNights + 7 : numberNights;
    $("#numNights").html(numberNights);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select required="required" class="daypicker" id="arrivalday" name="arrivalday">
    <option></option>
    <option value="1">Monday</option>
    <option value="2">Tuesday</option>
    <option value="3">Wednesday</option>
    <option value="4">Thursday</option>
    <option value="5">Friday</option>
    <option value="6">Saturday</option>
    <option value="7">Sunday</option>
</select>
<select required="required" class="daypicker" id="departureday" name="departureday">
    <option></option>
    <option value="1">Monday</option>
    <option value="2">Tuesday</option>
    <option value="3">Wednesday</option>
    <option value="4">Thursday</option>
    <option value="5">Friday</option>
    <option value="6">Saturday</option>
    <option value="7">Sunday</option>
</select>
<hr>
<div id="numNights"></div>

希望有帮助!

相关文章：