Javascript 表单验证。单选按钮和复选框。如何验证？

Question

我在单选和复选框的 Javascript 表单验证方面遇到问题。

我有一个外部 .js 脚本，我的所有函数规则都链接在 html 头部部分。

例如，我的规则如下所示：

    function IsValid4DigitZip( str ) {
    // Return immediately if an invalid value was passed in
    if (str+"" == "undefined" || str+"" == "null" || str+"" == "")  
        return false;

    var isValid = true;

    str += "";

    // Rules: zipstr must be 5 characters long, and can only contain numbers from
   // 0 through 9
   if (IsBlank(str) || (str.length != 4) || !IsInt(str, false))
        isValid = false;

   return isValid;
} // end IsValid4DigitZip

我将函数称为如下部分：

    if (IsValid4DigitZip(document.orderbooks.querySelectorAll("[name=postcode]")[0].value)) {

  } else {
    alert("Invalid postcode: You entered 3 or less digits. Please enter a 4 digit postcode");
    return false;
  }

有人可以使用我的示例帮助编写收音机和复选框的功能规则吗？

我只能使用 Javascript。没有 Jquery。

谢谢。

Answer 1

为了检查输入是否插入了字符串，我推荐使用正则表达式。 上面的代码不错，但是如果需要再做检查，就会造成代码重复。

这样做：

var zipCodeRegex = /^\d+$/

function isValid4DigitZip(str) {
    return str && str.length === 4 && zipCodeRegex.test(str);
}

这样，它会更容易维护和更易读。

附： 有一个很棒的网站可以测试您的正则表达式条件：

http://rubular.com/

使用它。

Answer 2

第一个条件检查str 是否有truthy value，第二个条件检查它的长度，最后一个条件检查所有字符是否都是数字。

附：我假设您的 Rules 中的 5 是一个错字，而您的意思是 4。

function isValid4DigitZip(str) {
	return str && str.length === 4 && /^\d+$/.test(str);
}

console.log(isValid4DigitZip('1234'));
console.log(isValid4DigitZip('124a'));
console.log(isValid4DigitZip('0000'));
console.log(isValid4DigitZip('12345'));
console.log(isValid4DigitZip('abcd'));