HTML / Javascript日历.日期范围不起作用

HTML/Javascript calender. Range of dates doesn´t work

本文关键字：范围不起作用日期日历 Javascript HTML 更新时间：2023-09-26

好吧，所以我想做这个简单的工作日计算器，我不能得到的日期范围工作。例如，如果我输入2012-05-31，它会显示超出范围(1-30)，但由于5月份有31天，所以它是不正确的。有人能解释一下为什么它不起作用吗?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">

<title>Weekday calculator</title>
<style type="text/css">
body {background-color: maroon; color:white; font-family: helvetica; text-align: center;}
h1 {font-size: 50px;} 
table { margin-left: auto; margin-right: auto;
    text-align:right; background-color:#993300 ; border: 5px solid
        firebrick }
</style>
</head>

<body>
<h1>Weekday calculator</h1>
<br>
</p>
<br><br>
        <form id="dateForm">
            <table>
                <tr>
                    <td>Year</td>
                    <td><input type="text" id="year" value="" size="8"></td>
                </tr>
                <tr>
                    <td>Month</td>
                    <td><input type="text" id="month" value="" size="8"></td>
                </tr>
                <tr>
                    <td>Day</td>
                    <td><input type="text" id="day" value="" size="8"></td>
                </tr>
                <tr>
                    <td>&nbsp;</td>
                    <td><input type="button" id="button" value="Submit" onclick="handleInput(this.form);"></td>
                </tr>
            </table>
        </form>
        <p id="output"></p>
        <script language="Javascript">
        function handleInput(form) {
            try {
                var strYear = form.year.value;
                var strMonth = form.month.value;
                var strDay = form.day.value;

                var intYear = parseInt(strYear);
                var intMonth = parseInt(strMonth);
                var intDay = parseInt(strDay);

                if (isNaN(intYear))
                    throw "Incorrect input. Year is not a number.";
                if (intYear < 0 || intYear > 9999)
                    throw "Incorrect input. Year is out of range (0--9999).";

                if (isNaN(intMonth))
                    throw "Incorrect input. Month is not a number";
                if (intMonth < 1 || intMonth > 12)
                    throw "Incorrect input. Month is out of range (1--12).";

                if (isNaN(intDay))
                    throw "Incorrect input. Day is not a number.";          
                if (intMonth == 1, 3, 5, 7, 8, 10, 12)
                    if (intDay < 1 || intDay > 31)
                    throw "Incorrect input. Day is out of range (1--31).";
                if (intMonth == 4, 6, 9, 11)
                    if (intDay < 1 || intDay > 30)
                    throw "Incorrect input. Day is out of range (1--30).";
                if (intMonth == 2)
                    if (intYear % 4 == 0 && intYear % 100 != 0)
                        if (intDay < 1 || intDay > 29)
                        throw "Incorrect input. Day is out of range (1--29).";


                var output = "It´s a... "  ;
                document.getElementById("output").innerHTML = output;
            }
            catch (error) {
                document.getElementById("output").innerHTML = "ERROR: " + error;
            }
            }
        </script>

</body>
</html>

这就是问题所在:

if (intMonth == 1, 3, 5, 7, 8, 10, 12)

JavaScript(和大多数语法与JavaScript相似的语言)没有将值与值列表进行比较的语法。(这不是语法错误，因为JavaScript，有点不典型，有逗号操作符， if最终成为if (12)。)

用||

代替

if (intMonth == 1 || intMonth == 3 || ...)

或者使用switch

switch (intMonth) {
    case 1:
    case 3:
    case 5:
    // ...
        // Code for these months here
        break;
    case 2:
        // Code for Feb here
        break;
    // ...
}

或者使用查找对象:

var maxDays = {
    1: 31,
    2: null, // Handle leap years separately
    3: 31,
    4: 30,
    // ...and so on
};
var maxDay;
if (maxDay == 2) {
    maxDay = /* handle leap years*/;
} else {
    maxDay = maxDays[intMonth];
}