此应用程序的Javascript表单验证

我需要对字段进行Javascript验证。我需要知道如何使每个标签的每个跨度都显示写入消息

目前，html代码是：

<form method="post" id="contactForm" onclick="return main();">
    <fieldset>
        <div class="subscribe">
            <label for="firstName">First name:</label>
                <input type="text" name="firstName" id="firstName"/>
                <span id="fnameMessage" class="infomessage">
                Your first name should contain at least 2 alpha characters.
            </span> 
        </div>
        <div class="subscribe">
            <label for="lastName">Last name:</label>
            <input type="text" name="lastName" id="lastName"/>
            <span id="lnameMessage" class="infomessage">
                Your last name should contain at least 2 alpha characters.
            </span>
        </div>
        <div class="subscribe">
            <label for="title">Title:</label>
            <select name="title" id="title">
                <option value="1"> Mr. </option>
                <option value="2"> Ms. </option>
                <option value="3"> Mrs. </option>
                <option value="4"> Miss. </option>
                <option value="5"> Master. </option>
            </select>
        </div>  
        <div class="subscribe">
            <label for="hNumber">Health Authority Number:</label>
            <input type="text" name="number" id="hNumber"/>
            <span id="hanMessage" class="infomessage">
                Your ZHA number should be in the form of 6 digit integer prefixed wit the letters ZHA.
            </span> 
        </div>
        <div class="subscribe">
            <label  for="email">Email address: </label>
            <input type="email" name="email" id="email"/>
            <span id="emailMessage" class="infomessage">
                Your email address should be as example: example@difexample.com. 
            </span> 
        </div>
        <div class="subscribe">
            <label for="phoneNumber">Telephone number:</label>
            <input type="text" name="phoneNumber" id="phoneNumber"/>
            <span id="phoneMessage" class="infomessage"> 
                Your phone number should contain 11 numeric characters.
            </span>
        </div>
        <div class="button">
            <input id="btn1" type="submit" value="Submit" /> 
        </div>
    </fieldsed>
</form> 

名字：
您的名字应至少包含2个字母字符。
姓氏：
您的姓氏应至少包含2个字母字符。
标题：
先生
太太
夫人
错过。
大师。
卫生当局编号：
您的ZHA编号应为以字母ZHA为前缀的6位整数形式。
电邮地址：
您的电子邮件地址应如下所示：example@difexample.com. 
电话号码：
您的电话号码应包含11个数字字符。

我编写的javascript代码是：

function main() {
    document.getElementById("contactForm").onsubmit = validateAll,
    document.getElementById("firstName").onblur = validateName,
    document.getElementById("lastName").onblur = validateName,
    document.getElementById("phoneNumber").onblur = validatePhone;
}

function validateName() {
    var test1 = fieldEmpty(this);
    var test2 = fieldLength(this,2,50);
    var test3 = fieldCharacters(this, "A");
    var result = test1&&test2&&test3;
    return result;
}

function validatePhone() {
    var test1 = fieldEmpty(this);
    var test2 = fieldLength(this,11,11);
    var test3 = fieldCharacters(this,"N");
    var result = test1&&test2&&test3;
    return result;
}

function fieldEmpty(id) {
    var valid = true;
    if (id.value == "") {
        valid = false;
        alert("Field Empty");
    }
    return valid;
}

function fieldLength(id,min,max) {
    var valid = true;
    var lng = id.value.length;
    if (lng < min || lng > max) {
        valid = false;
        alert("Field Length");
    }
    return valid;
}

function fieldCharacters(id,character) {
    var letters = /[a-zA-Z]/;
    var numbers = /[0-9]/;
    var patternTest;
    var valid = true;

    if(character == "N") {
        patternTest = numbers;
    }
    else if(character == "A") {
        patternTest = letters;
    }
    valid = patternTest.test(id.value);
    if (!valid) {
        alert("Pattern Fail");
    }
    return valid;
}

function validateField() {
    var noErrors = true;
    // var input = document.getElementById(this);
    if(this.value.length<2) {
        noErrors = false;
        alert("You need to input more than 1 character in " + this.id);
    }
    if(noErrors==false) {
        var temp = document.getElementById(this.id + "firstnamemessage");
        temp.className = "infomessage";
    }
}

function validateAll() {
    return false;
}

window.onload = main();

函数main（）{
document.getElementById（“contactForm”）.onsubmit=validateAll，
document.getElementById（“firstName”）.onblur=validateName，
document.getElementById（“lastName”）.onblur=validateName，
document.getElementById（“phoneNumber”）.onblur=validatePhone；
}
函数validateName（）{
var test1=字段空（此字段）；
var test2=字段长度（该值为2,50）；
var test3=字段字符（此为“A”）；
var result=test1&&test2&&test3；
返回结果；
}
函数validatePhone（）{
var test1=字段空（此字段）；
var test2=字段长度（这是11,11）；
var test3=字段字符（此“N”）；
var result=test1&&test2&&test3；
返回结果；
}
函数字段空（id）{
var valid=true；
如果（id.value==“”）{
有效=错误；
警报（“字段为空”）；
}
返回有效；
}
函数字段长度（id、最小值、最大值）{
var valid=true；
var lng=id.value.length；
如果（液化天然气<最小值|液化天然气>最大值）{
有效=错误；
警报（“字段长度”）；
}
返回有效；
}
函数字段字符（id、字符）{
变量字母=/[a-zA-Z]/；
变量数=/[0-9]/；
var模式检验；
var valid=true；
如果（字符==“N”）{
模式测试=数字；
}
else if（字符==“A”）{
模式测试=字母；
}
有效=patternTest.test（id.value）；
如果（！有效）{
警报（“模式失败”）；
}
返回有效；
}
函数validateField（）{
var noErrors=true；
//var input=document.getElementById（这个）；
如果（this.value.lengthway）你为什么不使用HTML5模式标记？你知道这件事吗，或者我必须写下答案吗？你好。这是一个评估，我必须使用javascript进行验证。我知道HTML5有一种方法，只是他们要求我做javascript。好吧……那么你节省了我的时间。