JavaScript实现输入框数值范围校验及奇偶性判断

安全阿岳

2026-5-21

解决方案

首先咱们把需求拆解清楚：

核心校验1：确保numbers输入框的数值落在 0 到 100 范围内（默认包含边界值，需要排除的话可以自行调整判断符号）
额外逻辑：当数值处于 0 到 1 区间时（这里默认针对整数0、1，毕竟奇偶性是整数的专属属性），判断它的奇偶性

要注意的是：输入框获取到的内容是字符串类型，必须先转换成数字再做校验，不然直接做数值判断会出bug。下面是修改后的完整校验逻辑代码：

// 获取输入值并转换为整数（如果需要支持小数，可改用parseFloat，但奇偶性仅针对整数有效）
const numbersVal = parseInt(document.getElementById("numbers").value);
const viaVal = document.getElementById("via").value;

// 先执行范围校验
if (!isNaN(numbersVal) && numbersVal >= 0 && numbersVal <= 100) {
    // 范围校验通过，处理0-1区间的奇偶性判断
    if (numbersVal >= 0 && numbersVal <= 1) {
        if (numbersVal % 2 === 0) {
            console.log("数值是0，属于偶数");
            // 这里写入你要执行的业务代码
        } else {
            console.log("数值是1，属于奇数");
            // 这里写入你要执行的业务代码
        }
    } else {
        // 数值在1-100之间，无需判断奇偶的情况
        console.log("数值在1-100范围内，执行对应逻辑");
        // 这里写入你要执行的业务代码
    }
} else {
    // 数值不在0-100范围，或者输入的不是有效数字
    console.log("请输入0-100之间的有效整数");
    // 这里可以添加提示用户的交互逻辑
}

一些实用补充：

如果numbers允许输入小数，但需要对整数部分判断奇偶，可以把parseInt换成Math.floor(numbersVal)先取整
要是还需要保留原逻辑中对via值的校验（等于"xxxx"），直接把外层if条件改成：if (viaVal === "xxxx" && !isNaN(numbersVal) && numbersVal >= 0 && numbersVal <= 100)即可
关于边界调整：如果要排除0或100，把>=改成>、<=改成<就可以轻松实现