Question

我创建了一个外部JavaScript来验证我在HTML中创建的表单。一些验证工作，但当我使用相同的代码来验证其他字段时，它将无法正常工作。例如。邮政编码必须包含数字 - 如果没有，邮政编码无效。

我尝试使用相同的信用卡代码，即信用卡必须有16位数 - 如果没有，信用卡号无效。我编写了邮政编码的代码并且它有效，但是当我尝试重新安排它以适应信用卡功能时，它不起作用。不太清楚为什么？我应该使用不同的功能吗？

这是我的外部javascript：

function validateForm()
{   
     if (isNaN(document.getElementById("postcode").value))
     {
         alert ("Your postcode is not valid");
     }
     else 
     {
         alert ("You have entered your postcode correctly");
     }

    if (document.getElementById ("email").value.length < 5 ||     
        document.getElementById ("email").value.indexOf("@")== -1) 
    {
        alert("Please enter your email min 5 chars and include @ symbol");
        document.getElementById("email").focus();
        return false;
    }

    if (isNaN(document.getElementById("creditcard").value))
    {
        alert ("Your creditcard is not valid");
    }
    else 
    {
    alert ("You have entered your creditcard correctly");
    }

    alert("Thank you for your submission!");
    return true;
}

Answer 1

首先，您可能不希望一次向用户提示10个错误对话框。所以你应该嵌套你的if else条款＆amp;第一个错误后该功能将停止。其次，isNaN无疑是一个很好的评估者，因为input.value可能返回string类型的值。使用正则表达式是一种更健壮的错误检查输入方式。第三，您想要解决用户的混淆错误。用户经常认为（我也是）：等等，我是否也应该在我的信用卡上写短信？＆＃39;。

所以你要删除点，破折号和＆amp;在继续之前的空白（那些可能在不知不觉中被包括在内）。其他字符只是无效。对于您的信用卡输入，即：

var ccVal = document.getElementById("creditcard").value;

// remove dots, dashes & whitespace
ccVal = ccVal.replace(/(\s|\.|\-)/g, ''); 

// if any other chars there, input value = incorrect & stop function
if ( ccVal.match(/\D/) ) { 
  alert('A credit card number only has decimals, silly.');
  return false;
} else {
  // Check for length now
  if ( ccVal.length !== 16) {
    alert('A credit card has 16 decimals, silly.');
    return false;
  } else {
    // more checks
    document.getElementById('myform').submit()
  }
}

请参阅此处的实施示例：http://jsbin.com/betawahi/1/edit

Answer 2

isNaN检查该值是否为整数，您需要额外检查长度。

保持代码与您设置其余功能的方式类似，检查信用卡是否为数字，长度为16，您需要：

if( !(isNaN(document.getElementById("creditcard").value) && document.getElementById("creditcard").value.length === 16) {
    alert("Credit Card Is Valid");
}else{
    alert("Your Credit Card is Not Valid");
    return false;
}

JavaScript中的数字验证

2 个答案: