在javascript表单验证中拒绝空格

时间:2011-06-15 13:02:40

标签: javascript validation forms

我正在使用以下表单验证,但如果在firstname / lastname / phone字段中使用了空格,我想引发错误。有什么想法吗?

<script type="text/javascript">
function validateFormOnSubmit(theForm) {

var reason = "";

  reason += validateUsername(theForm.first_name);
  reason += validateLastname(theForm.last_name);
  reason += validateEmail(theForm.email);
  reason += validatePhone(theForm.phone);      

  if (reason != "") {
    alert("Some fields need correction:\n" + reason);
    return false;
  }

}

function validateUsername(fld) {
    var error = "";
    var illegalChars = /\d/; // allow letters, numbers, and underscores

    if (fld.value == "") {
        fld.style.background = 'Yellow'; 
        error = "You didn't enter a first name.\n";
    } else if (illegalChars.test(fld.value)) {
        fld.style.background = 'Yellow'; 
        error = "The first name contains illegal characters.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}
function validatePhone(fld) {
    var error = ""; 

    if (fld.value == "") {
        fld.style.background = 'Yellow'; 
        error = "You didn't enter a phone number.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}
function validateLastname(fld) {
    var error = "";
    var illegalChars = /\d/; // allow letters, numbers, and underscores

    if (fld.value == "") {
        fld.style.background = 'Yellow'; 
        error = "You didn't enter a last name.\n";
    } else if (illegalChars.test(fld.value)) {
        fld.style.background = 'Yellow'; 
        error = "The last name contains illegal characters.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}
function trim(s)
{
  return s.replace(/^\s+|\s+$/, '');
}
function validateEmail(fld) {
    var error="";
    var tfld = trim(fld.value);                        // value of field with whitespace trimmed off
    var emailFilter = /^[^@]+@[^@.]+\.[^@]*\w\w$/ ;
    var illegalChars= /[\(\)\<\>\,\;\:\\\"\[\]]/ ;

    if (fld.value == "") {
        fld.style.background = 'Yellow';
        error = "You didn't enter an email address.\n";
    } else if (!emailFilter.test(tfld)) {              //test email for illegal characters
        fld.style.background = 'Yellow';
        error = "Please enter a valid email address.\n";
    } else if (fld.value.match(illegalChars)) {
        fld.style.background = 'Yellow';
        error = "The email address contains illegal characters.\n";
    } else {
        fld.style.background = 'White';
    }
    return error;
}
</script>

2 个答案:

答案 0 :(得分:0)

if(name.test(/\s+/g)){
   // there is one or more white spaces in the name
}

答案 1 :(得分:0)

使用illegalChars概念在正确的轨道上。但是,它与您的不同验证方法不一致。 RegEx也不会像您想要的那样匹配。我建议在所有验证方法中使用validateUsername添加相同的逻辑,使用这些RegEx:

function validateUsername(val) {
    var illegalChars = /[^a-zA-Z0-9_]/;
    ...
}

function validatePhone(val) {
    var illegalChars = /[^0-9().-]/; // No spaces allowed
    // Or
    var illegalChars = /[^0-9]/; // Only numbers no spaces or dashes or (area code)
    ...
}

您是否也使用throwtrycatch来管理错误?

function test() {
    throw new Error("Illegal Characters");
}

try
{
    test();
}
catch (e)
{
    alert(e); // Displays: "Error: Illegal Characters"
}